Taking a trek with SCVNGR: Developing asynchronous, mobile orientations and instruction for campus
Posted: May 13, 2013 | Author: Nicole Pagowsky | Filed under: academic librarianship, design, library, library instruction, mobile, technology | Tags: gamification, scnvgr | 1 Comment »Embedding the library in campus-wide orientations, as well as developing standalone library orientations, is often part of outreach and first year experience work. Reaching all students can be a challenge, so finding opportunities for better engaging campus helps to promote the library and increase student awareness. Using a mobile app for orientations can provide many benefits such as increasing interactivity and offering an asynchronous option for students to learn about the library on their own time. We have been trying out SCVNGR at the University of Arizona (UA) Libraries and are finding it is a more fun and engaging way to deliver orientations and instruction to students.
Why use game design for library orientations and instruction?
Game-based learning can be a good match for orientations, just as it can be for instruction (I have explored this before with ACRL TechConnect previously, looking at badges). Rather than just presenting a large amount of information to students or having them fill out a paper-based scavenger hunt activity, using something like SCVNGR can get students interacting more with the library in a way that offers more engagement in real time and with feedback. However, simply adding a layer of points and badges or other game mechanics to a non-game situation doesn’t automatically make it fun and engaging for students. In fact, doing this ineffectively can cause more harm than good (Nicholson, 2012). Finding a way to use the game design to motivate participants beyond simply acquiring points tends to be the common goal in using game design in orientations and instruction. Thinking of the WIIFM (What’s In It For Me) principle from a students’ perspective can help, and in the game design we used at the University of Arizona with SCVNGR for a class orientation, we created activities based on common questions and concerns of students.
Why SCVNGR?
scvngr home screen
SCVNGR is a mobile app game for iPhone and Android where players can complete challenges in specific locations. Rather than getting clues and hints like in a traditional scavenger hunt, this game is more focused on activities within a location instead of finding the location. Although this takes some of the mystery away, it works very well for simply informing people about locations that are new to them and having them interact with the space.
Students need to physically be in the location for the app to work, where they use the location to search for “challenges” (single activities to complete) or “treks” (a series of single activities that make up the full experience for a location), and then complete the challenges or treks to earn points, badges, and recognition.
Some libraries have made their own mobile scavenger hunt activities without the aid of a paid app. For example, North Carolina State University uses the NCSU Libraries’ Mobile Scavenger Hunt, which is a combination of students recording responses in Evernote, real time interaction, and tracking by librarians. One of the reasons we went with SCVNGR, however, is because this sort of mobile orientation requires a good amount of librarian time and is synchronous, whereas SCVNGR does not require as much face-to-face librarian time and allows for asynchronous student participation. Although we do use more synchronous instruction for some of our classes, we also wanted to have the option for asynchronous activities, and in particular for the large-scale orientations where many different groups will come in at many different times. Although SCVNGR is not free for us, the app is free to students. They offer 24/7 support and other academic institutions offer insight and ideas in a community for universities.
Other academic libraries have used SCVNGR for orientations and even library instruction. A few examples are:
- University of California – San Diego uses SCVNGR for their orientations. They created a LibGuide specifically for their SCVNGR orientation where they also post the scoreboard and photos.
- Oregon State University uses SCVNGR for international student orientations to increase awareness and support the university initiative to increase the OSU international population from 5 to 10% of the student body.
- Boise State is using SCVNGR for instruction rather than a focus on orientations. They have provided information to students who then go on to create their own SCVNGR orientations as an assignment.
- University of California – Merced recently wrote about SCVNGR in their campus-wide orientations, incorporating other areas on campus into the library’s orientation. They decided to try out SCVNGR from UCSD’s positive feedback, but had some issues with student turnout and discuss possible reasons for this in the article.
How did the UA Libraries use SCVNGR?
Because a lot of instruction has moved online and there are so many students to reach, we are working on SCVNGR treks for both instruction and basic orientations at the University of Arizona (UA). We are in the process of setting up treks for large-scale campus orientations (New Student Orientation, UA Up Close for both parents and students, etc.) that take place during the summer, and we have tested SCVNGR out on a smaller scale as a pilot for individual classes. There tends to be greater success and engagement if the Trek is tied to something, such as a class assignment or a required portion of an orientation session that must be completed. One concern for an app-based activity is that not all students will have smartphones. This was alleviated by putting students into groups ahead of time, ensuring that at least one person in the group did have a device compatible to use SCVNGR. However, we do lend technology at the UA Libraries, and so if a group was without a smartphone or tablet, they would be able to check one out from the library.
trek page for ais197b at ua libraries
We first piloted a trek on an American Indian Studies student success course (AIS197b). This course for freshmen introduces students to services on campus that will be useful to them while they are at the UA. Last year, we presented a quick information session on library services, and then had the students complete a scavenger hunt for a class grade (participation points) with pencil and paper throughout the library. Although they seemed glad to be able to get out and move around, it didn’t seem particularly fun and engaging. On top of that, every time the students got stuck or had a question, they had to come back to the main floor to find librarians and get help. In contrast, when students get an answer wrong in SCVNGR, feedback is programmed in to guide them to the correct information. And, because they don’t need clues to make it to the next step (they just go back and select the next challenge in the trek), they are able to continue without one mistake preventing them from moving on to the next activity. This semester, we first presented a brief instruction session (approximately 15-20 min) and then let students get started on SCVNGR.
You can see in the screenshot below how question design works, where you can select the location, how many points count toward the activity, type of activity (taking a photo, answering with text, or scanning a QR code), and then providing feedback. If a student answers a question incorrectly, as I mention above, they will receive feedback to help them in figuring out the correct answer. I really like that when students get answers right, they know instantly. This is positive reinforcement for them to continue.
scvngr answer feedback
The activities designed for students in this class were focused on photo and text-based challenges. We stayed away from QR codes because they can be finicky with some phones, and simply taking a picture of the QR code meets the challenge requirement for that option of activity. Our challenges included:
- Meet the reference desk (above): Students meet desk staff and ask how they can get in touch for reference assistance; answers are by text and students type in which method they think they would use the most: email, chat, phone, or in person.
- Prints for a day: Students find out about printing (a frequent question of new students), and text in how to pay for printing after finding the information at the Express Documents Center.
- Playing favorites: Students wander around the library and find their favorite study spot. Taking a picture completes the challenge, and all images are collected in the Trek’s statistics.
- Found in the stacks: After learning how to use the catalog (we provided a brief instruction session to this class before setting them loose), students search the catalog for books on a topic they are interested in, then locate the book on the shelf and take a picture. One student used this time to find books for another class and was really glad he got some practice.
- A room of one’s own: The UA Libraries implemented online study room reservations as of a year ago. In order to introduce this new option to students, this challenge had them use their smartphones to go to the mobile reservation page and find out what the maximum amount of hours study rooms can be reserved for and text that in.
SCVNGR worked great with this class for simple tasks, such as meeting people at the reference desk, finding a book, or taking a picture of a favorite study spot, but for tasks that might require more critical thinking or more intricate work, this would not be the best platform to use in that level of instruction. SCVNGR’s assessment options are limited for students to respond to questions or complete an activity. Texting in detailed answers or engaging in tasks like searching a database would be much harder to record. Likewise, because more instruction that is tied to critical thinking is not so much location-based (evaluating a source or exploring copyright issues, for example), and so it would be hard to tie these tasks and acquisition of skill to an actual location-based activity to track. One instance of this was with the Found in the Stacks challenge; students were supposed to search for a book in the catalog and then locate it on the shelf, but there would be nothing stopping them from just finding a random book on the shelf and taking a picture of it to complete the challenge. SCVNGR provides a style guide to help in game design, and the overall understanding from this document is that simplicity is most effective for this platform.
Another feature that works well is being able to choose if the Trek is competitive or not, and also use “SmartRoute,” which is the ability to have challenges show up for participants based on distance and least-crowded areas. This is wonderful, particularly as students get sort of congested at certain points in a scavenger hunt: they all crowd around the same materials or locations simultaneously because they’re making the same progress through the activity. We chose to use SmartRoute for this class so they would be spread out during the game.
scvngr trek settings
When trying to assess student effort and impact of the trek, you can look at stats and rankings. It’s possible to view specific student progress, all activity by all participants, and rankings organized by points.
scvngr statistics
Another feature is the ability to collect items submitted for challenges (particularly pictures). One of our challenges is for students to find their favorite study spot in the library and take a picture of it. This should be fun for them to think about and is fairly easy, and it helps us do some space assessment. It’s then possible to collect pictures like the following (student’s privacy protected via purple blob).
student images of ua main library via scvngr
On the topic of privacy, students enter in their name to set up an account, but only their first name and first initial of their last name appear as their username. Although last names are then hidden, SCVNGR data is viewable by anyone who is within the geographical range to access the challenge: it is not closed to an institution. If students choose to take pictures of themselves, their identity may be revealed, but it is possible to maintain some privacy by not sharing images of specific individuals or sharing any personal information through text responses. On the flip side of not wanting to associate individual students with their specific activities, it gets trickier when an instructor plans to award points for student participation. In that case, it’s possible to request reports from SCVNGR for instructors so they can see how much and which students participated. In a large class of over 100 students, looking at the data can be messier, particularly if students have the same first name and last initial. Because of this issue, SCVNGR might be better used for large-scale orientations where participation does not need to be tracked, and small classes where instructors would be easily able to know who is who in the data for activity.
Lessons learned
Both student and instructor feedback was very positive. Students seemed to be having fun, laughing, and were not getting stuck nearly as much as the previous year’s pencil-and-paper hunt. The instructor noted it seemed a lot more streamlined and engaging for the class. When students checked in with us at the end before heading out, they said they enjoyed the activity and although there were a couple of hiccups with the software and/or how we designed the trek, they said it was a good experience and they felt more comfortable with using the library.
Next time, I would be more careful about using text responses. I had gone down to our printing center to tell the current student worker what answers students in the class would be looking for so she could answer it for them, but they wound up speaking with someone else and getting different answers. Otherwise, the level of questions seemed appropriate for this class and it was a good way to pilot how SCVNGR works, if students might like it, and how long different types of questions take for bringing this to campus on a larger scale. I would also be cautious about using SCVNGR too heavily for instruction, since it doesn’t seem to have capabilities for more complex tasks or a great deal of critical thinking. It is more suited to basic instruction and getting students more comfortable in using the library.
Pros
- Ability to reach many students and asynchronously
- Anyone can complete challenges and treks; this is great for prospective students and families, community groups, and any programs doing outreach or partnerships outside of campus since a university login is not required.
- Can be coordinate with campus treks if other units have accounts or a university-wide license is purchased.
- WYSIWYG interface, no programming skills necessary
- Order of challenges in a trek can be assigned staggered so not everyone is competing for the same resources at the same time.
- Can collect useful data through users submitting photos and comments (for example, we can examine library space and student use by seeing where students’ favorite spots to study are).
Cons
- SCVNGR is not free to use, an annual fee applies (in the $900-range for a library-only license, which is not institution-wide).
- Privacy is a concern since anyone can see activity in a location; it’s not possible to close this to campus.
- When completing a trek, users do not get automatic prompts to proceed to the next challenge; instead, they must go back to the home location screen and choose the next challenge (this can get a little confusing for students).
- SCVNGR is more difficult to use with instruction, especially when looking to incorporate critical thinking and more complex activities
- Instructors might have a harder time figuring out how to grade participation because treks are open to anyone; only students’ first name and last initial appear, so if either a large class completes a trek for an assignment or if an orientation trek for the public is used, a special report must be requested from SCVNGR that the library could send to the instructor for grading purposes.
Conclusion
SCVNGR is a good way to increase awareness and get students and other groups comfortable in using the library. One of the main benefits is that it’s asynchronous, so a great deal of library staff time is not required to get people interacting with services, collections, and space. Although this platform is not perfect for more in-depth instruction, it does work at the basic orientation level, and students and the instructor in the course we piloted it on had a good experience.
References
Nicholson, S. (2012). A user-centered theoretical framework for meaningful gamification. Paper Presented at Games+Learning+Society 8.0, Madison, WI. Retrieved from http://scottnicholson.com/pubs/meaningfulframework.pdf.
—-
About Our Guest Author: Nicole Pagowsky is an Instructional Services Librarian at the University of Arizona where she explores game-based learning, student retention, and UX. You can find her on Twitter, @pumpedlibrarian.
Good Design: Pleasing to the Eyes “and” Functional
Posted: March 13, 2013 | Author: Bohyun Kim | Filed under: design, library | Tags: e-book lending program, kindle, poster, promotion | 5 Comments »Many librarians work with technology even if their job titles are not directly related to technology. Design is somewhat similar to technology in that aspect. The primary function of a librarian is to serve the needs of library patrons, and we often do this by creating instructional or promotional materials such as a handout and a poster. Sometimes this design work goes to librarians in public services such as circulation or reference. Other times it is assigned to librarians who work with technology because it involves some design software.
The problem is that knowing how to use a piece of design software does not entail the ability to create a great work of design. One may be a whiz at Photoshop but can still produce an ugly piece of design. Most of us, librarians, are quite unfamiliar with the concept of design. ACRL TechConnect covered the topic design previously in Design 101 – Part 1 and Design 101 – Part 2. So be sure to check them out. In this post, I will share my experience of creating a poster for my library in the context of libraries and design.
1. Background
My workplace recently launched the new Kindle e-book leader lending program sponsored by the National Network of Libraries of Medicine/Southeast Atlantic Region Express Mobile Technology Project. This project is to be completed in a few months, and we have successfully rolled out 10 Kindles with 30 medical e-book titles for circulation early this year. One of the tasks left for me to do as the project manager is to create a poster to further promote this e-book reader program. No matter how great the Kindle e-book lending program is, if patrons don’t know about it, it won’t get much use. A good poster can attract a lot of attention from library patrons. I can just put a small sign with “Kindles available!” written on it somewhere in the library. But the impact would be quite different.
2. Trying to design a poster
When I planned the grant budget, I included an budget item for large posters. But the item only covers the printing costs, not the design costs. So I started designing a poster myself. Here are a few of my first attempts. Even to my untrained eyes, these look unprofessional and amateurish, however. The first one looked more like a handout than a poster. So I decided to make the background black. That makes the QR code and the library logo invisible however. To fix this, I added a white background behind them. Slightly better maybe? Not really.
My first try doesn’t look so good!
My second attempt is only marginally better!
One thing I know about design is that an image can save or kill your work. A stunning image alone can make a piece of design awesome. So I did some Google search and found out this nice image of Kindle. Now it looks like that I need to flip the poster to make it wide.
The power of a nice image! Too bad it is copyrighted…
But there is a catch. The image I found is copyrighted. This was just an example to show how much power a nice image or photograph can have to the overall quality of a work of design. I also looked for Kindle images/photographs in Flick Creative Commons but failed to locate one that allows making derivatives. This is a very common problem for libraries, which tend to have little access to quality images/photographs. If you are lucky you may find a good image from Pixabay which offer very nice photographs and images that are in public domain.
Changed the poster setup to to make it wide.
3. What went wrong
You probably already have some ideas about what went wrong with my failed attempts so far. The font doesn’t look right. The poster looks more like a handout. The image looks amateurish in the first two examples. But the whole thing is functional for sure, some may say. It does the job of conveying the message that the library now has Kindle E-book readers to offer. Others may object. No, not really, the wording is vague, far from clear. You can go on forever. A lot of times, these issues are solved by adding more words, more instructions, and more links, which can be also problematic.
But one thing is clear. These are not pretty. And what that means is that if I print this and hang up on the wall around the library, our new Kindle e-book lending program would fail to convey certain sentiments that I had in mind to our library patrons. I want the poster to present this program as a new and exciting new service. I would like the patron to see the poster and get interested, curious, and feel that the library is trying something innovative. Conveying those sentiments and creating a certain impression about the library ‘is’ the function of the poster as much as informing library patrons about the existence of the new Kindle e-book reader lending program. Now the posters above won’t do a good job at performing that function. So in those aspects, they are not really functional. Sometimes beauty is a necessity. For promotional materials, which libraries make a lot but tend to neglect the design aspect of them, ‘pleasing to the eyes’ is part of their essential function.
4. Fixing it
What I should have done is to search for examples first that advertise a similar program at other libraries. I was very lucky in this case. In the search results, I ran into this quite nice circulation desk signage created by Saint Mary’s College of Maryland Library. This was made as a circulation desk sign, but it gave me an inspiration that I can use for my poster.
An example can give you much needed inspiration!
Once you have some examples and inspiration, creating your own becomes much easier. Here, I pretty much followed the same color scheme and the layout from the one above. I changed the font and the wording and replaced the kindle image with a different one, which is close to what my library circulates. The image is from Amazon itself, and Amazon will not object people using their own product image to promote the product itself. So the copyright front is clear. You can see my final poster below. If I did not run into this example, however, I would have probably searched for Kindle advertisements, posters, and similar items for other e-book readers for inspiration.
One thing to remember is the purpose of the design. In my case, the poster is planned to be printed on a large glossy paper (36′ x 24′). So I had to make sure that the image will appear clear and crisp and not blurry when printed on the large-size paper. If your design is going to be used only online or printed on a small-size item, this is less of an issue.
Final result!
5. Good design isn’t just about being pretty
Hopefully, this example shows why good design is not just a matter of being pretty. Many of us have an attitude that being pretty is the last thing to be considered. This is not always false. When it is difficult enough to make things work as intended, making them pretty can seem like a luxury. But for promoting library services and programs at least, just conveying information is not sufficient. Winning the heart of library patrons is not just about letting people know what the library does but also about how the library does things. For this reason, the way in which the library lets people know about its services and programs also matters. Making things beautiful is one way to improve on this “how” aspect as far as promotional materials are concerned. Making individual interactions personally pleasant and the transactions on the library website user-friendly would be another way to achieve the same goal. Design is a broad concept that can be applied not only to visual work but also to a thought process, a tool, a service, etc., and it can be combined with other concept such as usability.
Resources
While I was doing this, I also discovered a great resource, Librarian Design Share. This is a great place to look for an inspiration or to submit your own work, so that it can inspire other librarians. Here are a few more resources that may be useful to those who work at a library and want to learn a bit more about visual design. Please share your experience and useful resources for the library design work in the comments!
- Librarian Design Share
- Pixabay (Public domain images)
- The ultimate non-designers’ guide to branding
- 65 Incredibly Breathtaking Examples Of Poster Design
- 20 Creative Postcard & Event Handout Designs
- Designing Better Libraries (A blog about the application of design to libraries beyond visual design)
The Mobile App Design Process: A Tube Map Infographic
Posted: March 4, 2013 | Author: Nicholas Schiller | Filed under: coding, design, library, mobile, technology, usability | 1 Comment »Last June I had a great experience team-teaching a week-long seminar on designing mobile apps at the Digital Humanities Summer Institute (DHSI). Along with my colleagues from WSU Vancouver’s Creative Media and Digital Culture (CMDC) program, I’ll be returning this June to the beautiful University of Victoria in British Columbia to teach the course again1. As part of the course, I created a visual overview of the process we use for app making. I hope you’ll find it a useful perspective on the work involved in crafting mobile apps and an aid to the process of creating your own.
A visual guide to the process of designing and building mobile apps. Start with Requirements Analysis in the upper-left and follow the tracks to Public Release. (Click for full-sized image.)
Creating the Tube Map:
I’m fond of the tube-map infographic style, also know as the topological map2, because of its ability to highlight relationships between systems and especially because of how it distinguishes between linear (do once) and recursive (do over and over) processes. The linear nature of text in a book or images in slide-deck presentations can artificially impose a linearity that does not mirror the creative process we want to impart. In this example, the design and prototyping loops on the tube-map help communicate that a prototype model is an aid to modeling the design process and not a separate step completed only when the design has been finalized.
These maps are also fun and help spur the creative process. There are other tools for process mapping such as using flowcharts or mind-maps, but in this case I found the topological map has a couple of advantages. First and foremost, I associate the other two with our strategic planning process, so the tube map immediately seems more open, fun, and creative. This is, of course, rooted in my own experience and your experiences will vary but if you are looking for a new perspective on process mapping or a new way to display interconnected systems that is vibrant, fun, and shakes things up a bit the tube map may be just the thing.
I created the map using the open source vector-graphics program Inkscape[3. http://inkscape.org/] which can be compared to Adobe Illustrator and Corel Draw. Inkscape is free (both gratis and libre) and is powerful, but there is a bit of a learning curve. Being unfamiliar with vector graphics or the software tools to create them, I worked with an excellent tutorial provided by Wikipedia on creating vector graphic topological maps3. It took me a few days of struggling and slowly becoming familiar with the toolset before I felt comfortable creating with Inkscape. I count this as time well spent, as many graphics used in mobile app and icon sets required by app stores can be made with vector graphic editors. The Inkscape skills I picked up while making the map have come in very handy on multiple occasions since then.
Reading the Mobile App Map:
Our process through the map begins with a requirements analysis or needs assessment. We ask: what does the client want the app to do? What do we know about our end users? How do the affordances of the device affect this? Performing case studies helps us learn about our users before we start designing to meet their needs. In the design stage we want people to make intentional choices about the conceptual and aesthetic aspects of their app design. Prototype models like wireframe mock-ups, storyboards, or Keynotopia4 prototypes help us visualize these choices, eventually resulting in a working prototype of our app. Stakeholders can test and request modifications to the prototype, avoiding potentially expensive and labor intensive code revisions later in the process.
Once both the designers and clients are satisfied with the prototype and we’ve seen how potential users interact with it, we’re ready to commit our vision to code. Our favored code platform uses HTML 5, CSS 3, jQuery Mobile5, and PhoneGap6 to make hybrid web apps. Hybrid apps are written as web apps–HTML/JavaScript web sites that look and performlike apps–then use a tool like PhoneGap to translate this code into the native format for a device. PhoneGap translates a web app into a format that works with the device’s native programming environment. This provides more direct and thus faster access to device hardware and also enables us to place our app in official app stores. Hybrid apps are not the only available choice and aren’t perfect for every use case. They can be slower than native apps and may have some issues accessing device hardware, but the familiar coding language, multi-device compatibility, and ease of making updates across multiple platforms make them an ideal first step for mobile app design. LITA has an upcoming webinar on creating web apps that employs this system7.
Once the prototype has been coded into a hybrid app, we have another opportunity for evaluation and usability testing. We teach a pervasive approach that includes evaluation and testing all throughout the process, but this stage is very important as it is a last chance to make changes before sending the code to an app marketplace. After the app has been submitted, opportunities to make updates, fix bugs, and add features can be limited, sometimes significantly, by the app store’s administrative processes.
After you have spent some time following the lines of the tube map and reading this very brief description, I hope you can see this infographic as an aid to designing mobile web apps. I find it particularly helpful for identifying the source of a particular problem I’m having and also suggesting tools and techniques that can help resolve it. As a personal example, I am often tempted to start writing code before I’ve completely made up my mind what I want the code to do, which leads to frustration. I use the map to remind me to look at my wireframe and use that to guide the structure of my code. I hope you all find it useful as well.
Test-driving Purdue’s Passport gamification platform for library instruction
Posted: January 28, 2013 | Author: Nicole Pagowsky | Filed under: academic librarianship, design, library, library instruction, technology | 4 Comments »Gamification in libraries has become a topic of interest in the professional discourse, and one that ACRL TechConnect has covered in Applying Game Dynamics to Library Services and Why Gamify and What to Avoid in Gamification. Much of what has been written about badging systems in libraries pertains to gamifying library services. However, being an Instructional Services Librarian, I have been interested in tying gamification to library instruction.
When library skills are not always part of required learning outcomes or directly associated with particular classes, thinking more creatively about promotion and embeddedness of library tutorials prompted me to become interested in tying a badging system to the University of Arizona Libraries’ online learning objects. For a brief review on badges, they are visual representations of skills and achievements. They can be used with or instead of grades depending on the scenario and include details to support their credibility (criteria, issuer, evidence, currency).
From classhack.com
Becoming a beta tester for Purdue’s Passport platform gives me the opportunity to better sketch out what our plans are and to test how gamification could work in this context. Passport, according to Purdue, is “A learning system that demonstrates academic achievement through customizable badges.” Through this platform, instructors can design instruction for badges to be associated with learning outcomes. Currently, Passport can only be used by applying to be a beta tester. As they improve the software, it should be available to more people and have greater integration (it currently connects with Mozilla Open Backpack and within the Purdue system).We are still comparing platforms and possibilities for the University of Arizona Libraries, and testing Passport has been the first step in figuring out what we want, what is available, and how we would like to design this form of instruction. I will share my impression of Passport and using badging technology for these purposes from my experience using the software.
Refresher on motivation
It’s important to understand how motivation works in relation to a points and badges system, while also having a clear goal in mind. I recently wrote a literature review on motivation in gamified learning scenarios as part of my work toward a second Master’s in Educational Technology. The general ideas to take away are the importance of employing game mechanics thoughtfully into your framework to avoid users’ relying solely on the scoring system, as well as focusing on the engagement aspects of gamification rather than using badges and points just for manipulation. Points should be used as a feedback mechanism rather than just promoting them as items to harvest.
Structure and scalability
Putting this into perspective for gamifying library instruction at the University of Arizona, we want to be sure student motivation is directed at developing research skills that can be visually demonstrated to instructors and future employers through badges, with points serving as feedback and further motivation. We are using the ACRL Information Literacy Standards as an outline for the badges we create; the Standards are not perfect, but they serve well as a map for conceptualizing research skills and are a way we can organize the content. Within each skill set or badge, activities for completion are multidimensional: students must engage in a variety of tasks, such as doing a tutorial, reading a related article or news story, and completing a quiz. We plan to allow for risk taking and failure — important aspects of game design — so students can re-try the material until they understand it (Gee, 2007).
As you can see in this screen capture, the badges corresponding to the ACRL Standards include: Research Initiator (Standard 1), Research Assailant (Standard 2), Research Investigator (Standard 3), and Research Warrior (Standard 4). As a note, I have not yet created a badge for Standard 5 or one to correspond with our orientations (also, all names you can see in any image I include are of my colleagues trying out the badges, and not of students). A great aspect of this platform is the ability to design your own badges with their WYSIWYG editor.
Main challenge screen
Because a major issue for us is scalability with limited FTE, we have to be cautious in which assessment methods we choose for approving badges. Since we would have a hard time offering meaningful, individualized feedback for every student who would complete these tasks, having something automatic is more ideal. Passport allows options for students to test their skills, with multiple-choice quizzes, uploading a document, and entering text. For our purposes, using multiple-choice quizzes with predetermined responses is currently the best method. If we develop specific badges for smaller courses on a case-by-case basis, it might be possible to accept written responses and more detailed work, but in trying to roll this out to campus-at-large, automated scoring is necessary.
Leveling up
Within each badge, also referred to as a challenge, there are tasks to complete. Finishing these tasks adds up to earning the badge. It’s essentially leveling up (which is progressing to the next level based on achievement); although the way Passport is designed, the students can complete the tasks in any order. Within the suite of badges, I have reinforced information and skills throughout so students must use previous skills learned for future success. In this screen capture, you can see the overall layout by task title.
Task progress by users
When including tasks that require instructor approval (if students were to submit documents or write text), an instructor would click on each yellow box stating that approval is needed to determine if the student successfully completed the task and supply personalized feedback (image above). And you can see the breakdown of tasks under each challenge to review what was learned; this can serve as confirmation for outside parties of what kind of work each badge entailed (image below).
Badge work details
Showing off
Once badges are earned, they can be displayed in a user’s Passport profile and Mozilla Open Badges. Here is an example of what a badge portfolio looks like:
User badge portfolio
Passport “classrooms” are closed and require a log in for earning badges (FERPA), but if students agree to connectivity with Mozilla’s Open Badges Backpack, achievements can then be shared with Twitter, Facebook, LinkedIn, and other networks. Badges can also connect with e-portfolios and resumes (since it’s in Beta this functionality works best with Purdue platforms). This could be a great, additional motivator for students in helping them get jobs. From Project Information Literacy, we do know employers find new graduates are lacking research skills, so being able to present these skills as fulfilled to future employers can be useful for soon-to-be and recent graduates. The badges link back to more information, as mentioned, and employers can get more detail. Students can even make their submitted work publicly available so employers, instructors, and peers can see their efforts.
Wrapping up
Whether or not it is possible to integrate Passport fully into our library website for students to access, using this tool has at least given me a way to essentially sketch out how our badging system will work. We can also try some user testing with students on these tasks to gauge motivation and instructional effectiveness. Having this system become campus-wide in collaboration with other units and departments would also aid in creating more meaning behind the badges; but in the meantime, tying this smaller scale layout to specific class instruction or non-disciplinary collaborations will be very useful.
Although some sources say gamification will be taking a huge nosedive by 2014 due to poor design and over-saturation, keeping tabs on other platforms available and how to best incorporate this technology into library instruction is where I will be looking this semester and beyond as we work on plans for rolling out a full badging system within the next couple of years. Making learning more experiential and creating choose-your-own adventure scenarios are effective in giving students ownership over their education. Using points and badges for manipulating users is certainly detrimental and should fall out of use in the near future, but using this framework in a positive manner for motivation and to support student learning can have beneficial effects for students, campus, and the library.
Additional Resources
Books:
Dignan, A. (2012). Game Frame. New York: The Free Press.
Gee, J. P. (2007). What video games have to teach us about learning and literacy. New York: Palgrave Macmillan.
Kapp, K. M. (2012). The gamification of learning and instruction: Game-based methods and strategies for training and education. San Francisco, CA: Pfeiffer.
Koster, R. (2005). A theory of fun for game design. Scottsdale, AZ: Paraglyph Press.
Online:
Because Play Matters: A game lab dedicated to transformative games and play for informal learning environments in the iSchool at Syracuse: http://becauseplaymatters.com/
Digital badges show students’ skills along with degree (Purdue News): http://www.purdue.edu/newsroom/releases/2012/Q3/digital-badges-show-students-skills-along-with-degree.html
Gamification Research Network: http://gamification-research.org/
TL-DR: Where gamers and information collide: http://tl-dr.ca/
—-
About Our Guest Author: Nicole Pagowsky is an Instructional Services Librarian at the University of Arizona where she explores game-based learning, student retention, and UX. You can find her on Twitter, @pumpedlibrarian.
Responsive web design and libraries
Posted: October 4, 2012 | Author: Lisa Kurt | Filed under: design, library, library design, mobile, technology, usability, web | 13 Comments »
Brad Frost’s This is Responsive Website via desktop browser
Responsive web design is not really a new concept, yet libraries and many websites in general, still have a way to go in adopting this method of web design. ACRL’s Tech Connect has covered various web design topics, including mobile applications, hybrid mobile applications, design basics, and website readability. Consider the responsive web design approach and its benefits another tool in your toolbelt and yet another option for libraries to present themselves online to their users.
So what is it?
As the number of devices in which we are able to view and interact with websites grow, it becomes more cumbersome to keep up with the plethora of laptops, desktops, mobile devices, and potentially devices or platforms that don’t yet exist. As our users view our websites and online resources in these various ways, we must ask the simple question- what does this look like and what is the user’s experience? If you have a smart phone or tablet, you may recall viewing a website and being annoyed that it is merely a shrunken teeny version of the site you’re used to seeing rather than adjusting nicely to accommodate the device you’re using. In many cases it requires you, the user, to do something to make it work on your device rather than accomodate you; a rather unappealing way to treat users I think. Here’s an examples from the New York Times website:
New York Times displayed on a desktop browser
New York Times displayed on the iphone aka the Barbie sized website
To avoid these awful Barbie-sized websites on our devices, the solutions we often see are: develop a mobile website, develop a mobile app, or create a website that is responsive and can handle most anything that comes it’s way. All of these are great solutions to developing a mobile presence however the responsive approach is fast emerging as a winning solution.
What makes it great?
The very basic benefit to creating a responsive website design is that you have one site for all devices- it’s intended to be inclusive for desktop machines and a variety of devices. A responsive site does not require anything of the user; no downloading or additional buttons to click, the result is immediate. That’s it. Rather than separate approaches for mobile through either a mobile site or mobile applications and then another approach for desktop machines- this method is flexible and covers it all under one design.
Responsive websites in the wild
The best way to experience responsive web design is to try out some websites that are designed in this way. Here are a few great examples with screenshots included- I recommend checking them out in your browser and then shrinking your browser window down to get the full effect or how this technology works. If you’re even more invested in the experience, bring the site up on any number of devices to see the benefits of responsive design done well.
Graphic designer, John Boilard, showcases his portfolio website using responsive design:
http://jpboneyard.com/ As you can see the images are flexible and each project displays very well on many devices. The images adjust accordingly and the performance of the site is easy to use and easy to view.
JP Boneyard Design viewed on a desktop browser
JP Boneyard design viewed on an iphone
Web designer and the founder of responsive design, Ethan Marcotte, http://ethanmarcotte.com/ showcases not only his design but also his publications. There is a variety of content on his website and the responsive design works extremely well. For a quick article on responsive design from the graphic design perspective, see his article on A List Apart.
Ethan Marcotte website via desktop browser
Ethan Marcotte website via the iphone
Matthew Reidsma, web services librarian at Grand Valley State University, also has a fantastic flexible site where even videos are responsive: http://matthew.reidsrow.com/ He is a web librarian to watch as he often writes and presents on responsive design (more on that below) and he is always creating really awesome and interesting web projects. The Grand Valley State University Libraries have a fantastic responsive site: http://gvsu.edu/library/
Matthew Reidsma’s website via desktop browser
Matthew Reidsma’s website via iphone
Grand Valley State University Libraries website via desktop browser
Grand Valley State University Libraries website via iphone
The website TitleCase, co-founded by designers and type experts, Jessica Hische and Erik Marinovich; this is an elegant example of showcasing this side project with a focus on type while all giving users a pleasant experience through responsive design.
Title Case website via desktop browser
Title Case website via iphone
Scribble Tone, the Portland, OR based design studio, created this responsive website for Design Week Portland: http://www.designweekportland.com/#footer With the gorgeous flexible images, the bold colors, and clear typefaces- all created and designed responsively- this website is pleasant and fun to use.
Portland Design Week website via desktop browser
Portland Design Week website via iphone
Resources
If you were like me and did not attend ALA Annual this year and get to see Matthew Reidma’s fantastic talk on Responsive Web Design for Libraries: Get Beyond the Myth of the Mobile Web, you are still in luck because he posted the talk and slides on his website here. He covers quite a lot and he provides a fantastic list of resources within that post. It’s a great presentation and truly worth watching all the way through.
To delve in more deeply into the details of designing with responsive web methods, I highly recommend Responsive Web Design by Ethan Marcotte. He not only provides good examples and techniques for designing this way, but he also explains the flexible grid and flexible images as well and displays his balanced approach between good design and good functionality. His website is also responsive and he’s designed complex websites: http://ethanmarcotte.com/
Another option, particularly for those who use WordPress as a CMS, there are a number of free responsive themes available that are already designed. Simply selecting the theme or taking a further step by creating a child theme that you could then customize would be a fairly simple way to make your website design responsive and more enjoyable.
The website, This is Responsive has a wide variety of tools to develop your own responsive website as does Bootstrap. So even if you don’t think of yourself as a designer, there are a lot of ways to get started in creating good design that is also responsive.
Whether you are interested in responsive design, mobile websites, or creating mobile apps, it is critical for libraries to be aware of the user experience as our customers use our websites and online resources on a variety of devices. The bar is being raised with responsive designed websites and users will come to expect this kind of experience. As the web, platforms, and devices evolve, it will be crucial for libraries to be already poised to offer a positive experience through good thoughtful design.
Brad Frost’s This is Responsive Website via iphone
What exactly does a fiber-based gigabit speed library app look like?
Posted: October 1, 2012 | Author: Jim Hahn | Filed under: data, design, library, what-if | Tags: fiber, gigabit speed apps, Mozilla Ignite Challenge | Leave a comment »Mozilla and the National Science Foundation are sponsoring an open round of submissions for developers/app designers to create fiber-based gigabit apps. The detailed contest information is available over at Mozilla Ignite (https://mozillaignite.org/about/). Cash prizes to fund promising start up ideas are being award for a total of $500,000 over three rounds of submissions. Note: this is just the start, and these are seed projects to garner interest and momentum in the area. A recent hackathon in Chattanooga lists out what some coders are envisioning for this space: http://colab.is/2012/hackers-think-big-at-hackanooga/
The video for the Mozilla Ignite Challenge 2012 on Vimeo is slightly helpful for examples of gigabit speed affordances.
If you’re still puzzled after the video, you are not alone. One of the reasons for the contest is that network designers are not quite sure what immense levels of processing in the network and next generation transfer speeds will really mean.
Consider that best case transfer speeds on a network are somewhere along the lines of 10 megabits per second. There are of course variances of this speed across your home line (it may hover closer to 5 mb/s), but this is pretty much the standard that average subscribers can expect. A gigabit speed rate transfers data at 100 times that speed, 1,000 megabits per second. When a whole community is able to achieve 1,000 megabits upstream and downstream, you basically have no need for things like “streaming” video – the data pipes are that massive.
One theory is that gigabit apps could provide public benefit, solve societal issues and usher in the next generation of the Internet. Think of gigabit speed as the difference between getting water (Internet) through a straw, and getting water (Internet) through a fire-hose. The practicality of this contest is to seed startups with ideas that will in some way impact healthcare (realtime health monitoring), the environment and energy challenges. The local Champaign Urbana municipal gigabit speed fiber cause is noble, as it will provide those in areas without access to broadband an awesome pipeline to the Internet. It is a intergovernmental partnership that aims to serve municipal needs, as well as pave the way for research and industry start-ups.
Here are some attributes that Mozilla Ignite Challenge lists as the possible affordances of fiber based gigabit speed apps:
- Speed
- Video
- Big Data
- Programmable networks
As I read about the Mozilla Ignite open challenge, I wondered about the possibilities for libraries and as a thought experiment I list out here some ideas for library services that live on gigabit speed networks:
* Consider the video data you could provide access to – in libraries that are stewarding any kind of video gigabit speeds would allow you to provide in-library viewing that has few bottlenecks. A fiber-based gigabit speed video viewing app of all library video content available at once. Think about viewing every video in your collection simultaneously. You could have them playing to multiple clusters (grid videos) in the library at multiple stations. Without streaming.
* Consider Sensors and sensor arrays and fiber. One idea that is promulgated for the use of fiber-based gigabit speed networks are the affordances to monitor large amounts of data in real time. The sensor networks that could be installed around the library facility could help to throttle energy consumption in real time, making the building more energy efficient and less costly to maintain. Such a facilities based app would impact savings on the facilities budgets.
* Consider collaborations among libraries with fiber affordances. Libraries that are linked by fiber-based gigabit speeds would be able to transfer large amounts of data in fractions of what it takes now. There are implications here for data curation infrastructure (http://smartech.gatech.edu/handle/1853/28513).
Another way to approach this problem is by asking: “What problem does gigabit speed networking solve?” One of the problems with the current web is the de facto latency. Your browser needs to request a page from a server which is then sent back to your client. We’ve gotten so accustomed to this latency that we expect it, but what if pages didn’t have to be requested? What if servers didn’t have to send pages? What if a zero latency web meant we needed a new architecture to take advantage of data possibilities?
Is your library poised to take advantage of increased data transfer? What apps do you want to get funding for?
2012 Eyeo Festival
Posted: August 16, 2012 | Author: Lisa Kurt | Filed under: careers, change, continuing education, data, design, technology, web | Tags: conference, continuing education, creativity, data visualization, design, eyeo, interactive design, professional development | Leave a comment »Tuesday June 5th through Friday June 8th 2012, 500 creatives from numerous fields such as, computer science, art, design, data visualization, gathered together to listen, converse, and participate in the second Eyeo Festival. Held in Minneapolis, MN at the Walker Art Center, the event organizers created an environment of learning, exchange, exploration, and fun. There were various workshops with some top names leading the way. Thoughtfully curated presentations throughout the day complemented keynotes held nightly in party-like atmospheres: Eyeo was an event not to be missed. Ranging from independent artists to the highest levels of innovative companies, Eyeo offered inspiration on many levels.
Why the Eyeo Festival?
As I began to think about what I experienced at the Eyeo Festival, I struggled to express exactly how impactful this event was for me and those I connected with. In a way, Eyeo is like TED and in fact, many presenters have given TED talks. Eyeo has a more targeted focus on art, design, data, and creative code but it is also so much more than that. With an interactive art and sound installation, Zygotes, by Tangible Interaction kicking off the festival, though the video is a poor substitute to actually being there, it still evokes a sense of wonder and possibility. I strongly encourage anyone who is drawn to design, data, art, interaction or to express their creativity through code to attend this outstanding creative event and follow the incredible people that make up the impressive speaker list.
I went to the Eyeo Festival because I like to seek out what professionals in other fields are doing. I like staying curious and stretching outside my comfort zone in big ways, surrounding myself with people doing things I don’t understand, and then trying to understand them. Over the years I’ve been to many library conferences and there are some amazing events with excellent programming but they are, understandably, very library-centric. So, to challenge myself, I decided to go to a conference where there would be some content related to libraries but that was not a library conference. There are many individuals and professions outside of libraries that care about many of the same values and initiatives we do, that work on similar kinds of problems, and have the same drive to make the world a better place. So why not talk to them, ask questions, learn, and see what their perspective is? How do they approach and solve problems? What is their process in creating? What is their perspective and attitude? What kind of communities are they part of and work with?
I was greatly inspired by the group of librarians who have attended the SXSWi Festival which has grown further over the years. There are a now a rather large number of librarians speaking about and advocating for libraries in such an innovative and elevated platform. There is even a Facebook Group where professionals working in libraries, archives, and museums can connect with each other for encouragement, support, and collaborations in relation to SXSWi. Andrea Davis, Reference & Instruction Librarian at the Dudley Knox Library, Naval Postgraduate School in Monterey, CA, has been heavily involved in offering leadership in getting librarians to collaborate at SXSW. She states, “I’ve found it absolutely invigorating to get outside of library circles to learn from others, and to test the waters on what changes and effects are having on those not so intimately involved in libraries. Getting outside of library conferences keeps the blood flowing across tech, publishing, education. Insularity doesn’t do much for growth and learning.”
I’ve also been inspired by librarians who have been involved in the TED community, such as Janie Herman and her leadership with Princeton Public Library’s local TEDx in addition to her participation in the TEDxSummit in Doha, Qatar. Additionally, Chrystie Hill, the Community Relations Director at OCLC, has given more than one TedX talk about libraries. Seeing our library colleagues represent our profession in arenas broader than libraries is energizing and infectious.
Librarians having a seat at the table and a voice at two of the premier innovative gatherings in the world is powerful. This concept of librarians embedding themselves in communities outside of librarianship has been discussed in a number of articles including The Undergraduate Science Librarian and In the Library With the Lead Pipe.
Highlights
Rather than giving detailed comprehensive coverage of Eyeo, you’ll see a glimpse of a few presentations plus a number of resources so that you can see for yourself some of the amazing, collaborative work being done. Presenter’s names link to the full talk that you can watch for yourself. Because a lot of the work being done is interactive and participatory in some way, I encourage you to seek these projects out and interact with them. The organizers are in the midst of processing a lot of videos and putting them up on the Eyeo Festival Vimeo channel; I highly recommend watching them and checking back for more.
Ben Fry
Principal of Fathom, a Boston based design and data visualization firm, and co-initiator of the programming language Processing, Ben Fry’s work in data visualization and design is worth delving into. In his Eyeo presentation, 3 Things, the project that most stood out was the digitization project Fathom produced for GE: http://fathom.info/latest/category/ge. Years of annual reports were beautifully digitized and incorporated into an interactive web application they built from scratch. When faced with scanning issues, they built a tool that improved the scanned results.
Jer Thorp
Data artist in residence for the New York Times, and former geneticist, Jer Thorp’s range in working with data, art, and design is far and wide. Thorp is one of the few founders of the Eyeo Festival and in his presentation Near/Far he discussed several data visualization projects with the focus on storytelling. The two main pieces that stood out from Jer’s talk was his encouragement to dive into data visualization. He even included 10 year old, Theodore Zaballos’ handmade visualization of The Illiad which was rather impressive. The other piece that stood out was his focus on data visualization in context to location and people owning their own data versus a third party. This lead into the Open Paths project he showcased. He has also presented to librarians at the Canadian library conference, Access 2011.
Jen Lowe
Jen Lowe was by far the standout from all of the amazing Ignite Eyeo talks. She spoke about how people are intrinsically inspired by storytelling and the need for those working with data to focus on storytelling through the use of visualizing data and the story it tells. She works for the Open Knowledge Foundation in addition to running Datatelling and she has her library degree (she’s one of us!).
Jonathan Harris
Jonathan Harris gave one of the most personal and poignant presentations at Eyeo. In a retrospective of his work, Jonathan covered years of work interwoven with personal stories from his life. Jonathan is an artist and designer and his work life and personal life are rarely separated. Each project began with the initial intention and ended with a more critical inward examination from the artist. The presentation led to his most recent endeavor, the Cowbird project, where storytelling once again emerges strongly. In describing this project he focused on the idea that technology and software could be used for good, in a more human way, created by “social engineers” to build a community of storytellers. He describes Cowbird as “a community of storytellers working to build a public library of human experience.”
Additional people + projects to delve into:
Fernanda Viegas and Martin Wattenberg of the Google Big Picture data visualization group. Wind Map: http://hint.fm/wind/
Kyle McDonald: http://kylemcdonald.net/
Tahir Temphill: http://tahirhemphill.com/ and his latest work, Hip Hop Word Count: http://staplecrops.com/index.php/hiphop_wordcount/
Julian Oliver: http://julianoliver.com/
Nicholas Felton of Facebook: http://feltron.com/
Aaron Koblin of the Google Data Arts Group: http://www.aaronkoblin.com/ and their latest project with the Tate Modern: http://www.exquisiteforest.com/
Local Projects: http://localprojects.net/
Oblong Industries: http://oblong.com/
Eyebeam Art + Technology Center: http://eyebeam.org/
What can libraries get from the Eyeo Festival?
Libraries and library work are everywhere at this conference. That this eclectic group of creative people were often thinking about and producing work similar to librarians is thrilling. There is incredible potential for libraries to embrace some of the concepts and problems in many of the presentations I saw and conversations I was part of. There are multiple ways that libraries could learn from and perhaps participate in this broader community and work across fields.
People love libraries and these attendees were no exception. There were attendees from numerous private/corporate companies, newspapers, museums, government, libraries, and more. I was not the only library professional in attendance so I suspect those individuals might see the potential I see, which I also find really exciting. The drive behind every presenter and attendee was by far creativity in some form, the desire to make something, and communicate. The breadth of creativity and imagination that I saw reminded me of a quote from David Lankes in his keynote from the New England Library Association Annual Conference:
“What might kill our profession is not ebooks, Amazon or Google, but a lack of imagination. We must envision a bright future for librarians and the communities they serve, then fight to make that vision a reality. We need a new activist librarianship focused on solving the grand challenges of our communities. Without action we will kill librarianship.”
If librarianship is in need of more imagination and perhaps creativity too, there is a world of wonder out there in terms of resources to help us achieve this vision.
The Eyeo Festival is but one place where we can become inspired, learn, and dream and then bring that experience back to our libraries and inject our own imagination, ideas, experimentation, and creativity into the work we do. By doing the most creative, imaginative library work we can do will inspire our communities; I have seen it first hand. Eyeo personally taught me that I need to fail more, focus more, make more, and have more fun doing it all.
Tips for Making Your First Mobile App a Success
Posted: July 25, 2012 | Author: Aimee Fifarek and Ann Porter | Filed under: Books, design, library, marketing, mobile, technology | Tags: design, gimme, marketing, mobile, scottsdale | 1 Comment »About a year ago we launched the Gimme Engine (gimme.scottsdalelibrary.org) – a mobile web book recommendation engine. Choose one of the categories – Gimme a Clue, Gimme Something Good to Eat, etc – and the Engine will offer you a staff-recommended book from the Scottsdale Public Library collection, complete with summary, staff review, and a quick link to the mobile catalog to check availability or reserve.
Since launch, our app and the Gimme Engine Brain Trust that created it have won a number of awards – including a 2012 OITP Cutting Edge Technology in Library Services award. What’s our secret? We are happy to share what we learned in our process with the hope it will help you in your next technology process.
Find out what your users (and future users) want
When our team got together for the first time we had more ideas than we knew what to do with – everything from a mobile formatted version of our web site to a Dewey-caching in library scavenger hunt. We soon realized that in order for us to create a successful, and more importantly, sustainable mobile app, we needed to poll our customers and find out what exactly they want out of a mobile app. Though we had done some basic surveys of staff in the past, we didn’t feel that we were the experts best suited to properly create & distribute a survey that would ultimately drive our entire project.
We hired a local experience design agency called Forty to craft a survey to get the information we so desperately needed. Forty also helped distribute the survey via their social media, email lists and other outlets. This meant that in addition to our customer we would get responses from non-customers as well. This would help us understand if there was a difference in need between customers and future-customers (at least that is how we like to think of our ‘non customers’.)
What they want might be what you already have
There was in fact no real difference between customers and non customer need in the survey results but one thing was clear: current and future customers had no idea that we already had a mobile catalog with most of the standard functionality that they wanted. Great, we thought, just get the word out about the mobile catalog and our job is done! Then we realized no, we still have all this LSTA money that the Arizona State Library was nice enough to give us . . . we should probably spend that out.
Maximize your resources
So we looked at the highest items on the list that we didn’t have in mobile – book reviews and staff recommendations. That’s when we decided to make the book recommendation app. As it turned out we already had a lot of the raw materials for the project. Staff was already doing book reviews and posting them on GoodReads. We had content enrichment services for bib data and book jackets(Syndetics). And we had the mobile catalog and the ability to generate RSS feeds of items in the collection (AirPAC and FeedBuilder from Innovative Interfaces). All we needed was someone with enough experience to put that together.
Back to Forty for the design work and to hire a programmer. We had so little money to work with that I thought for sure the end result would use a rubber band. But when we sat down with the programmer not only was he able to do the project he actually saved us $3,000 in expected software costs by putting together the feeds, mobile catalog, content enrichment with some JavaScript and the GoodReads API. The end result is a very simple, easy to care for web-based app that keeps working as long as we keep feeding it the raw materials – staff book reviews.
Maximize your expertise
From the outset of this project, we engaged all levels of staff. This was critical to ensuring that whatever product we created would be supported throughout the organization, as well as vetted to ensure that we didn’t leave out any crucial elements. One of those elements was the encoding that allowed FeedBuilder to pick up the items for Gimme. A quick chat with the catalogers solved that problem – they created a series statement utilizing controlled vocabulary that would identify the item as belonging to a particular Gimme category and pasted the review into the MARC record. By adding Library staff review_[gimmeCategory] in the 830 field of each record and indexing it, not only were we able to create a constant flow of records for the Gimme feeds we were able to give all library staff easy access to these reviews when searching in the catalog.
The other process we had to create was a standardized way for people to submit reviews. Here we called on the cataloging group, the folks who where posting to GoodReads, and our IT department to create a book review form on SharePoint. The form itself was easy – staff at any level go to SharePoint (which functions as our intranet), type in their name, info about the book and their review and submit. The catalogers and GoodReads group developed a process to “hand off” reviews that ensure that it gets encoded, posted in both the catalog and GoodReads, and at all times is associated with the ISBN of the same edition so that everything seems to magically link together. Having staff who don’t normally interact working together on the share outcome certainly fostered a sense of ownership and respect in the group.
Don’t just build it . . . make it fun
Once the Gimme engine design was complete, and we had the back end programming to make it work, we were ready to unleash Gimme out into the world. Our biggest concern was that Gimme would get lost amongst all of the other products and services the library offered. One evening while cooking a delicious shepherd’s pie, a light bulb went off over Ann’s head. Since we were using our library staff book recommendations to fuel Gimme, why not turn our Staff in marketing vehicles? The next day a call went out to staff asking whoever wished to help to come forward. The end result was 15 life-sized cardboard cut outs of library staffers, highlighting their personalities. Attached to each was a ‘speech bubble’ that directed customers to go to http://gimme.scottsdalelibrary.org to see what books that staff member recommended.
The next phase was to create floor decals to put in various spots in our five library branches, so as customers walked through the library they would gain exposure to Gimme. We created corresponding buttons for staff to wear, which helped spur conversions and questions from customers, “What is Gimme?” This marketing plan engaged all level of staff, which helped make the launch of Gimme a success.
One year later the Gimme Engine is continuing to grow with new categories and increasing stats. Not only was the project a success but it by integrating the various workflows we’ve been able to make it, as well as doing fun reviews by staff, part of our culture. We hope that our experience can help you in some way make your next project as successful as the Gimme Engine.
About Our Guest Authors:
Aimee Fifarek is the Library Technologies and Content Senior Manager for the Scottsdale Public Library in Arizona. She has an MLIS and an MA in English from University of Wisconsin-Milwaukee and spent 6 years as the Systems Librarian at Louisiana State University in Baton Rouge before going to Scottsdale. Her professional interests include ebook platforms & development, self-publishing, and mobile technologies. She can be found on Twitter @aimeelee.
Ann Porter is the Community Relations Coordinator at the Scottsdale Public Library. She has over 11 years of marketing, PR and media relations experience, working for organizations such as a major cosmetics company, an online retargeting agency that was recently purchased by Ebay and for a major NFL team.
Design 101: design elements, part 2 Typography
Posted: July 6, 2012 | Author: Lisa Kurt | Filed under: design, library design, marketing, web | Tags: design, graphic design, lettering, typography, web design | Leave a comment »
Previously I wrote about the importance of design in libraries, the design process and discussed three core elements of design: color, composition, and size. In this post, I’d like to focus on typography. Though not traditionally a design element, typography is more a tool or a language to use within your design to convey the message you are trying to achieve.
As mentioned previously, design elements work together to create a successful design that communicates to your audience if used well, and typography is no exception.
Type is rather complex and has a rich history. There are abundant options available with free and for-a-fee font files available. There are even resources available to have beautifully designed type on your website. Designers still create typefaces from scratch if needed, particularly for decorative uses. But it is perfectly acceptable to use already available font files and most designers do this. To create thoughtful designs using type well does not have to be difficult; with some basic knowledge, you can successfully choose the right type for the job and develop a successful design.
About fonts versus typefaces
As you work in design, it’s good practice to use the correct terminology. When most people talk about letterforms, they use the term, “fonts.” However what most people really mean is “typeface.” Fonts are really the format in which the typeface is available- librarians can understand this distinction easily. As Ellen Lupton states in Thinking With Type, “A typeface is the design of the letterforms; a font is the delivery mechanism…In digital systems, the typeface is the visual design, while the font is the software that allows you to install, access, and output the design.” Lupton’s book is a resource I highly recommend by the way. If you read nothing else about design and type, please read her book. I’ve provided the citation toward the end of the post.
Typography versus design
Typography within design should never be an afterthought. In fact, in many cases the typeface you choose can make or break a design. Every design should be a fluid creation, balancing between the various design elements and type. A designs are being created, it is best to bring the elements up together, tweaking and adjusting each piece as you go while also taking that step back to see the whole picture. As in writing, it can be more beneficial to keep the overall theme and outline in mind as you work on various details and sections of a piece; being too focused in on one small detail may be detrimental to the overall design piece.
Basics
There is a lot to learn and geek out over design and typography but rather than overwhelm, I’m going to give some good basics about type that will get you started right away. There are several main type classifications and the main three groupings are humanist, transitional, and modern or geometric.
Ellen Lupton defines each as the following: “Humanist letterforms are closely connected to calligraphy and the movement of the hand. Transitional and modern typefaces are more abstract and less organic.”
For the purpose of this post and for what you really need to know, I’m going to lump them into four categories based on the look of the typeface: Serif, Slab Serif, Sans Serif, and Decorative. There are examples of each one below.
Serif
Serif typefaces essentially have feet. Serif typefaces are essentially more organic and derive from various periods in history. You see these typefaces traditionally used in novels and blocks of text. Their use is not limited to that, however. There are many new Serif typefaces being developed that are contemporary based on their more historic predecessors.
Baskerville
Garamond
Typographic Anatomy Lesson print: http://www.ligatureloopandstem.com/product/lesson-plan-print
Slab Serif
Slab Serif typefaces also have feet but their feet are blockier and slab-like, hence the name. These typefaces were developed for advertising and are more contemporary than traditional Serifs. These are used in a variety of ways but are popular for titles, posters, flyers, websites, and logos.
Museo Slab
Archer from the H&FJ foundry: http://www.typography.com/fonts/font_overview.php?productLineID=100033&path=head
Sans serif
As the name implies, these typefaces do not have Serifs or “feet”. They are generally more contemporary and less organic than Serif typefaces. These are very popular for text within websites, logos, and posters.
Helvetica
Gill Sans
Keep Calm by K-Type: http://www.k-type.com/?p=2199
Decorative
Decorative or ornamental typefaces are self explanatory. These are typefaces that can stand alone as an image or illustration. They are highly decorative and should be used very carefully as they can overpower a design or clash more easily with other elements. Not all decorative typefaces are equal and many designers who are really good with decorative type do the lettering by hand and specialize in this area specifically. When done well and with skill, decorative typefaces are a true art form and when done poorly, they can quickly highlight an amateurish design. Decorative type is gaining in popularity as people, designers and non-designers alike, are embracing retro styles again and these typefaces are seeing a resurgence in use.
Rosewood STD
Decorative type from Louise Fili: http://www.louisefili.com/
Bold, Italic, Underlined, Caps, and, and, and….
There is nothing wrong with using these elements. However it’s a good rule of thumb to use them sparingly and not all at once. By using them judiciously, they will have more impact and continue to maintain readability, which is key to design. Use them with caution.
Use
As you design and use type, be aware of what your type may be conveying to your audience and the medium in which you are designing in. Some typefaces are more successful on screen than others and some typefaces are specifically designed for print, screen, etc. A good resource for typefaces on the web is the 3rd edition of The Web Style Guide. There is a section specifically on typography that is helpful and gives insite into where typefaces are today.
Like all design elements and design in general, you are communicating with others. What is the type you are using saying? Does it fit with the message you want to send? Are you going for a modern and sleek look? Do you want to give your design a tactile/print feel or maybe you want it to be an homage to a specific period in design history? How does the typeface fit in with the rest of your design? What kind of mood might you be setting with the type and design elements you’ve put together? Type has a personality so be sure to choose a typeface that assists and hopefully conveys the message you want to give.
The end
At this point, you have the type basics and I hope that this gets you thinking more about the typefaces you see and perhaps use in your designs. I highly encourage reading Ellen Lupton’s book, Thinking With Type: a critical guide for designers, writers, editors, and students. She goes over a good deal of design basics and some design history and it’s a quick, enjoyable, informative read.
A couple of other good resources are: The FontFeed and The Elements of Typographic Style.
The best way to learn type and design is to just start. Things change so quickly and what was once right can become wrong or out of style very quickly. In design, you learn much more quickly by designing and making work. So pick a project and begin!
The Middle Way of Mobile App Design
Posted: July 5, 2012 | Author: Jim Hahn | Filed under: design, mobile | Tags: hybrid app, mobile app, web app | Leave a comment »We’ve heard this conversation on mobile app design before, where well meaning coders will say to you: “don’t design native mobile apps, it isn’t worth your time, “ followed by the common refrain/rebuttal : “native apps take advantage of the hardware, like camera, and WiFi components of the phone…”
I’m not very interested in the debate, since it isn’t a very informed or intelligent discussion when one argues of developing native apps over mobile web apps, or the binary opposite. The common misconception is that there are only two approaches to design of mobile apps: native or web-based. The native approach includes developing in compiled languages like Java in the Android platform, and Objective C in the iOS platform. Web based mobile apps make use of HTML5 and CSS and Javascript to achieve an app-like interface and experience. A popular template used in the web based approach is the JQuery mobile framework: http://jquerymobile.com/
But there is a middle way. You can design and build a mobile app utilizing compiled languages as well as HTML, CSS and Javascript. The hybrid approach is HTML with native app elements. These rely on using cross platform mobile frameworks, like the PhoneGap framework (http://phonegap.com/).
You might wonder — why make an app using the PhoneGap framework? Using this HTML5 + native tools approach allows you to get into the hardware of the phone; like camera data, to incorporate things like a barcode scanner into your hybrid app. A full list of API elements is available here: http://docs.phonegap.com/en/1.9.0/index.html. If you want a more basic rundown of how PhoneGap itself works in a library context, check out a past ALA presentation I did for the Mobile Computing Interest Group back in 2010: http://www.ideals.illinois.edu/handle/2142/16542
Mobile app stores like Google Play and the Apple iTunes App Store help to drive traffic to your services and sites, and they will result in increased use of your library services and collections –and make possible new services, by their sheer existence.
Here are a few examples of apps I’ve built this way:
–video tour app of the undergrad library, code available here: https://github.com/jimfhahn/ugl4eva
— recently added Library and Information Science books at the University of Illinois Urbana-Champaign, code available here: https://github.com/jimfhahn/newbooks
What your users and library will need is, of course, entirely up to you, but to know the options available such as hybrid approaches is a way to make informed and intelligent decisions about your library’s mobile presence.
Full disclosure: I researched and wrote an iPhone development book unpacking a hybrid approach to mobile application design that advances ways for web developers to make their apps available from the iTunes app store (goo.gl/n3LUB). But you could also make your apps available from Google Play, using the Hybrid approach as well.
