Library Mobile WebDesign: Tips, Tricksand ResourcesRachel Vacek, Head of Web ServicesUniversity of Houston LibrariesBerika...
The mobile phone is history’s fastest growingcommunication device
In 2009,     530 million peopleused a cell phone or smartphone   to access the mobile web       Strategy Analytics, March ...
By 2015,that number is expected     to rise to overONE BILLION people   Strategy Analytics, March 2010
Smart phones have even overtaken the PC in sales
How smartphone owners describe their phones    Browse the web    http://www.pewinternet.org/Reports/2011/Smartphones.aspx,...
It’s not justabout thephones.It’s about theexperiencesthey have withtheir phones.
Name 5 things yourusers do when theyvisit your physical       library.
Name 5 things yourusers do when theyvisit your library’s      website.
Should theresources andservices that are inyour physicalbuilding and onyour websitealso be offered onyour mobilewebsite?
Yes   NoIt depends
Reference               RSS feeds    Mobile          services                from blogs    friendly    databases          ...
With so many options,how do you begin to plan  for a mobile website?
Get to know your users• Conduct surveys or interviews of library  users who use mobile devices• Ask in different geographi...
Get your users more  involved in the process• Look at focus group alternatives• Create a “Developer’s Lab”• Create Interns...
Ask questions• Why does your library  want a mobile presence?• What are your peer  libraries doing?• Do you know what your...
You want yourusers to feel goodusing the servicesand resources youprovide on yourmobile library site
Which do you choose? mobile website        ornative application
Mobile Application                          Mobile WebsitePerformance                  • Runs locally, resulting in quick ...
Mobile Application                            Mobile Website                  • Runs locally, resulting in quick        • ...
Mobile Application                         Mobile Website              • More investment because it           • Less inves...
Summary of features         Mobile Application                            Mobile Website         • Easy to locate in an ap...
Which is best for your library?
Mobile WebsiteMobile Application      Both     Neither
You know what’s on your websiteYou know the needs of your usersYou know what tech skills you haveavailable to you You know...
Let’s dig in!
Options for building     mobile native apps• Native platform SDK (software development kit)• General purpose multi-platfor...
Options for building      mobile websites• Develop a mobile CSS• Do nothing - users will still see your site, but it  won’...
Options for building        mobile websites• Mobile application tool with web capability    -   Completely home-grown appr...
Hybrid ApproachYou can do more than one of the methods for     creating your library’s mobile presence
Managing your mobile site• Design & Functionality   - Can be determined by the stylesheet or the     framework chosen   - ...
Examples of mobilelibrary websites and    applications
New York Public Library
NCSU Libraries    Computer Availability   Find your study group
NCSU Libraries      Reserve a room   Historic image collections
Seattle Public Library
Nashville Public Library  They have a  mobile website,  but it includes  links to device  specific apps
VC/UHV LibraryMobile Web Presence
Library Website
MobileWebsite -vcuhvlibrary.uhv.edu/mobile
Mobile-friendly   Research applications usersresearch tools     can download themselves
Users love the     Users can get directionspopular LibGuides        to the library
Using QR codes tomarket mobile site
UH LibrariesMobile Web Presence
A different approachiPhone App + Mobile Website
An iPhone app for searching the UH Libraries’ Catalog    was developed by graduate students in the the       “Ubiquitous C...
Mobile Website - m.lib.uh.edu Think differently about the   RSS feeds are quick andhierarchy of your homepage     easy but...
Include catalog and/or                             LibGuides comes with adiscovery platform, but be                       ...
You have videos? Create a   Show off your images onchannel and include them     your library’s Flickr site
Features we’re considering•   Mobile campus walking tour with historic images    pulled from our Digital Library collectio...
Reference               RSS feeds    Mobile          services                from blogs    friendly    databases          ...
Final thoughts• Understand your users’ mobile behaviors and needs  and look at the tools at your disposal before you  deci...
Helpful resources•   “Choosing Between Native and Mobile Web Applications.”    Gartner Report by Analyst Nick Jones. Febru...
Thanks!Rachel VacekHead of Web ServicesUniversity of Houston Librariesrevacek@uh.eduBerika WilliamsWeb Services LibrarianV...
Library Mobile Web Design: Tips, Tricks and Resources
Library Mobile Web Design: Tips, Tricks and Resources
Upcoming SlideShare
Loading in …5
×

Library Mobile Web Design: Tips, Tricks and Resources

5,654 views

Published on

Going mobile with your website? This presentation will walk you through some things to consider when thinking about the functionality and content of your library’s mobile presence, and point to useful tools for building your mobile website.

Published in: Education, Technology, Business
0 Comments
13 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
5,654
On SlideShare
0
From Embeds
0
Number of Embeds
416
Actions
Shares
0
Downloads
167
Comments
0
Likes
13
Embeds 0
No embeds

No notes for slide
  • We each introduce one another, and Berika kicks it off. :)\n
  • \n
  • \n
  • \n
  • In fact, when it comes to sales, smartphones have overtaken pc sales. With more consumers trading in their old feature phones for smartphones, the smartphone market actually eclipsed the PC market during the last quarter of 2010 for the first time, according to data from the IDC (International Data Corporation –a market intelligence source). Vendors shipped 100.0 million smartphones during the fourth quarter, while IDC logged 92.1 million PC shipments during the same time period, according to IDC numbers from January.\n\n
  • Mostly good feelings. Some people don’t like the feeling of being connected all the time. But people have deep connections with their mobile devices, it seems. Those connections - and feelings - are part of the user experience. Our mobile library websites should also also give users these same feelings.\n
  • \n
  • Stop and interact with the audience. Get them thinking....Ask them to name 5 things their users do when visiting the physical library.\n
  • After they have named a few things, ask them to name 5 things users do on their websites.\n
  • Should those resources, services, AND experiences (user experiences) be replicated on a mobile site? \n
  • \n
  • \n
  • \n
  • \n
  • •Focus Group Alternatives: Informal setting such as a library open house, planned social event in a party-esque /social type atmosphere. You can collaborate with other departments or organizations by “hosting” the event and initiating informal discussions, conversations with topics including, but not limited to - mobile web access to get an insider’s perspective on what users are doing while advocating library resources and services[perfect for all types of libraries]\n•“Developers Lab”: Take advantage of students or patron users’ capital (their skill sets) by giving them a chance to further develop them, gain experience and get exposure by participating in the process. [perfect for academic, school, and public libraries;]Corporate Libraries can garner\n•Internships: Partner up with talented students who would like to further develop their skillsets and make meaning contributions to meet a need or provide a service to users that hasn’t been met through the building of mobile apps. Corporate and other libraries can do competitions for their user or consumer base to rally up ideas to stimulate creativity and boost maximum PR for the library and its services.\n•Mobile Evaluation, Testing, and Branding through Embedded Librarianship: Ask questions to see what users are thinking, how they are behaving in their environment while in development. Create a deliberate, “casual” encounter with mentions of the finished mobile website or product during a reference session or at the point of need.\n\n
  • •We went mobile to reach a larger subset users that were already using mobile devices to access our desktop site based on our web statistics and generalized national indicators such as the research found on Pew Internet and American Life Project.\n•A great website that gives a peak at how a portion of other libraries are going mobile is: http://www.libsuccess.org/index.php?title=M-Libraries\n•Based on our research, we knew that users wanted a quick and convenient way to access information from our library. They wanted something user friendly, intuitive and easy to navigate.\n•We simply define success with our mobile site based on traffic and repeat visitors. We rely on comments and feedback and constantly question: what keeps bringing them back? Are there any frustrations or obstacles that keep them from using it again?\n\n
  • having a good user experience is vital to people coming back and using it again.\n
  • Rachel picks up here.\n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • Berika picks up here again.\n
  • \n
  • \n
  • \n
  • \n
  • \n
  • Based on our resources and staff, we started off with a mobile website. Over time we may go more advanced offering apps, but we are starting off small based on basic needs of our users and the ability to reach cross platforms in the least expensive way possible.\n\n
  • On our desktop homepage of the VC/UHV Library’s website, we created a portal for users to access the information that was most important to them through research. We also accessed the most commonly visited pages and most asked questions at the reference desk to present this content. When it came to our mobile website, we selected the “basics” where physical and online needs intersected by placing our library hours, maps and directions, library catalog and ways to contact us on our mobile site. Additionally, we created a research section with select mobile friendly databases with subjects that generated the most traffic on her desktop site and at the reference desk. \n
  • The VC/UHV Library’s approach was (sort of) hybrid. We took advantage of certain features that were already mobile optimized like Google Maps, their APIs, LibGuides, and select databases to offer on our mobile website. For everything else, we coded in HTML and CSS, such as building an interface for our catalog and ASKALIBRARIAN chat. The only drawback with the actual online catalog results, was that our OPAC is not mobile optimized. (We have Horizon through Sirsi Dynix) It is actually a miniature desktop version of the OPAC, which is not exactly the best solution, but it works for now.\nThe usage statistics from the VC/UHV Library’s website and most commonly asked reference questions set the tone for how we chose to arrange the hierarchy of our homepage. We also used RSS feeds for library hours, but an important consideration is that the source content still needs to be maintained.\n\n
  • \n
  • \n
  • •Publicize different areas of the mobile website by creating QR codes (free on sites such as www.qrstuff.com), which can be scanned for quick access to those webpages\n•QR codes can be used in the library stacks for instant help, such as access to study guides or tutorials, or even an interactive library call number floor map.\n•I’ve learned that the shorter the URL, the more simple the QR Code, and thus the easier it is to scan. \n•I recommend URL shortners like bitly.com that can instantly gauge the traffic of who uses the link without going through web analytics software.\n• Must carefully plan the QR Code information representing the library or you’ll overdo it… like a child with pages of stickers! \n\n
  • Rachel picks it up again.\n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • Berika puts in her final thoughts too.\n
  • We take questions! Yay for us!\n
  • Library Mobile Web Design: Tips, Tricks and Resources

    1. 1. Library Mobile WebDesign: Tips, Tricksand ResourcesRachel Vacek, Head of Web ServicesUniversity of Houston LibrariesBerika Williams, Web Services LibrarianVictoria College/University of Houston – VictoriaTexas Library Association District 8 Fall ConferenceOctober 22, 2011
    2. 2. The mobile phone is history’s fastest growingcommunication device
    3. 3. In 2009, 530 million peopleused a cell phone or smartphone to access the mobile web Strategy Analytics, March 2010
    4. 4. By 2015,that number is expected to rise to overONE BILLION people Strategy Analytics, March 2010
    5. 5. Smart phones have even overtaken the PC in sales
    6. 6. How smartphone owners describe their phones Browse the web http://www.pewinternet.org/Reports/2011/Smartphones.aspx, July 11, 2011
    7. 7. It’s not justabout thephones.It’s about theexperiencesthey have withtheir phones.
    8. 8. Name 5 things yourusers do when theyvisit your physical library.
    9. 9. Name 5 things yourusers do when theyvisit your library’s website.
    10. 10. Should theresources andservices that are inyour physicalbuilding and onyour websitealso be offered onyour mobilewebsite?
    11. 11. Yes NoIt depends
    12. 12. Reference RSS feeds Mobile services from blogs friendly databases LibraryOpen access instructionresources Your SMS QR codes services library website Event calendarLocation guidesor floor maps here Research or Catalog homework guides Social media Augmented Videos reality Image Audio collections tours
    13. 13. With so many options,how do you begin to plan for a mobile website?
    14. 14. Get to know your users• Conduct surveys or interviews of library users who use mobile devices• Ask in different geographic regions and cover all your demographics• Understand their mobile habits• Learn their device ownership trends
    15. 15. Get your users more involved in the process• Look at focus group alternatives• Create a “Developer’s Lab”• Create Internships• Conduct mobile evaluations, testing, and marketing through embedded librarianship
    16. 16. Ask questions• Why does your library want a mobile presence?• What are your peer libraries doing?• Do you know what your users want?• What defines success?
    17. 17. You want yourusers to feel goodusing the servicesand resources youprovide on yourmobile library site
    18. 18. Which do you choose? mobile website ornative application
    19. 19. Mobile Application Mobile WebsitePerformance • Runs locally, resulting in quick • Relies on the Internet, resulting in loading time slower load and response time • An app has to be developed for • Device agnostic, so only one each platform, pushed to each website needs to be built Access platform’s app store, and then • Access is through a web browser downloaded to a smartphone for • Can be viewed on many devices, users to access including feature phones • Updates are deployed through • Relatively simple to support as an app store that has a multi- there are less things to go wrong week submission and approval on the user’s deviceSupportability process • Potential to become more • Updates require users to complex download new versions • No interaction with an app store • Updates to server are instant for users • Mobile platforms such as • HTML standards evolve more Application Android, Apple iOS, Symbian, slowly Evolvement RIM and Windows Mobile are evolving rapidly
    20. 20. Mobile Application Mobile Website • Runs locally, resulting in quick • Potentially less satisfying loading time depending on Internet • Made for mobile so it has fluid connection and speed interaction and intuitive interface • If a mobile stylesheet is applied,Quality of User • Can access sensors such as GPS users might have usability issues Experience and accelerometers with access to webpages that are • Can take advantage of touch not mobile-friendly screens and gestures • With the exception of social • Can take advantage of augmented media and games, users still reality prefer mobile sites over apps • More risky because they can be • Less risky because site exists Technical more complex, riskier to develop • A mobile version can be created Risk and harder to test by applying a mobile stylesheet or by building a simplified site • Testing for native apps is slower • Only one site has to be tested and more complex if multiple • Quality assurance and usability Testing platforms are supported testing is simpler because there • Testing might involve UX such as is less involved touchscreens or GPS
    21. 21. Mobile Application Mobile Website • More investment because it • Less investment because it’s requires more resources, time quicker and easier to build Cost and skills • Can support any device that has • Have to develop for multiple a web browser platforms • Thousands of mobile apps • Users can find your mobile available on each platforms’s website via search engines, linksMarketing store, making the audience from other websites, and links smaller and more focused embedded in emailsOperational • Must have room on the • Good cellular or wifi signal is smartphone to download required Issues • Application development • Knowledge of HTML and CSS demands more sophisticated for basic mobile theming skills • Skills in HTML5 and PHP are Skill Set • Developers with these skills are useful for creating more engaging harder to find websites, but not all smartphone browsers support HTML5 yet
    22. 22. Summary of features Mobile Application Mobile Website • Easy to locate in an app store • Platform agnosticPros • Faster speed because it’s installed • Flexible and easier control over locally maintenance of content • Specialized functionality • Can be built in HTML & CSS • Requires specific knowledge and • Slower than a mobile app skills to develop • Less functionality than a mobileCons • Built differently for each platform app, but HTML 5 is changing that • Approvals are required to place in app store
    23. 23. Which is best for your library?
    24. 24. Mobile WebsiteMobile Application Both Neither
    25. 25. You know what’s on your websiteYou know the needs of your usersYou know what tech skills you haveavailable to you You know the limitations of yourlibrary’s wifi
    26. 26. Let’s dig in!
    27. 27. Options for building mobile native apps• Native platform SDK (software development kit)• General purpose multi-platform tools - attempts to “write once, run anywhere”• Outsource the development, or hire a developer with mobile app development experience on each platform you want to create
    28. 28. Options for building mobile websites• Develop a mobile CSS• Do nothing - users will still see your site, but it won’t be optimized for the best mobile user experience• Google sites - mobile templates - http://sites.google.com/mobilize• Have an open-source cms like Wordpress or Drupal that power your website? Find a mobile friendly theme!
    29. 29. Options for building mobile websites• Mobile application tool with web capability - Completely home-grown approach• JavaScript framework and code libraries - jQuery Mobile, iUI, jQtouch, iWebKit• Use Chad Haefele’s Mobile Site Generator - http://www.hiddenpeanuts.com/msg/
    30. 30. Hybrid ApproachYou can do more than one of the methods for creating your library’s mobile presence
    31. 31. Managing your mobile site• Design & Functionality - Can be determined by the stylesheet or the framework chosen - Keep your branding consistent• Content - Have a strategy for maintaining the content - Pull (RSS feeds, from other systems if you can in content APIs, etc.)
    32. 32. Examples of mobilelibrary websites and applications
    33. 33. New York Public Library
    34. 34. NCSU Libraries Computer Availability Find your study group
    35. 35. NCSU Libraries Reserve a room Historic image collections
    36. 36. Seattle Public Library
    37. 37. Nashville Public Library They have a mobile website, but it includes links to device specific apps
    38. 38. VC/UHV LibraryMobile Web Presence
    39. 39. Library Website
    40. 40. MobileWebsite -vcuhvlibrary.uhv.edu/mobile
    41. 41. Mobile-friendly Research applications usersresearch tools can download themselves
    42. 42. Users love the Users can get directionspopular LibGuides to the library
    43. 43. Using QR codes tomarket mobile site
    44. 44. UH LibrariesMobile Web Presence
    45. 45. A different approachiPhone App + Mobile Website
    46. 46. An iPhone app for searching the UH Libraries’ Catalog was developed by graduate students in the the “Ubiquitous Computing” course in theUniversity of Houston Computational Physiology Lab
    47. 47. Mobile Website - m.lib.uh.edu Think differently about the RSS feeds are quick andhierarchy of your homepage easy but have limitations
    48. 48. Include catalog and/or LibGuides comes with adiscovery platform, but be mobile interface, too clear on tool’s purpose
    49. 49. You have videos? Create a Show off your images onchannel and include them your library’s Flickr site
    50. 50. Features we’re considering• Mobile campus walking tour with historic images pulled from our Digital Library collection• Mobile version of the Digital Library• Expanded computer availability to other labs in the library, possibly branches• Laptops available for checkout• Room/computer reservation• More research tools specifically made for mobile• More social media integration• Augmented reality layar
    51. 51. Reference RSS feeds Mobile services from blogs friendly databases LibraryOpen access instructionresources Your SMS QR codes services library website Event calendarLocation guidesor floor maps here Research or Catalog homework guides Social media Augmented Videos reality Image Audio collections tours
    52. 52. Final thoughts• Understand your users’ mobile behaviors and needs and look at the tools at your disposal before you decide between a mobile app or website• Sometimes a simple mobile stylesheet is a good enough place to start• Don’t just recreate your entire website in a whole new mobile website• Start small, add more complex features over time• Walk a day in your users’ shoes to get a feel for what services might be helpful on a mobile device
    53. 53. Helpful resources• “Choosing Between Native and Mobile Web Applications.” Gartner Report by Analyst Nick Jones. February 23, 2011.• The Anywhere Library: A Primer for the Mobile Web. Courtney Greene, Missy Roser, and Elizabeth Ruane. ACRL 2010.• M-Libraries, Library Success Wiki - http://www.libsuccess.org/index.php?title=M-Libraries• Chad Haefele’s Mobile Site Generator - http://www.hiddenpeanuts.com/msg/• Google Mobile Sites - http://sites.google.com/mobilize
    54. 54. Thanks!Rachel VacekHead of Web ServicesUniversity of Houston Librariesrevacek@uh.eduBerika WilliamsWeb Services LibrarianVictoria College/University of Houston – Victoriawilliamsbs@uhv.eduPresentation available online:slideshare.net/vacekrae

    ×