Embed Size (px)
DESCRIPTION
Pre-conference delivered at Code4Lib 2014. This structured hackfest will give attendees an opportunity to explore methods to create responsive mobile apps using the Bootstrap framework and a set of APIs for accessing library data. We will start with an API template for creating space-based mobile tools that draw from work coming out of the IMLS funded Student/Library Collaborative grant. Available APIs will include a room reservation template and codebase for implementing at any campus and the set of Minrva catalog APIs generating JSON. Hosts will give a brief report of a study on student hacking projects and interests in mobile library apps that are the basis for the templates utilized in this Hackfest. By the end of the pre-conference attendees will have a sample responsive mobile web app in Bootstrap 3 to bring back to their campus which can plug into their site-based content.
Citation preview
Code4Lib 2014Responsive Design Hackfest
Monday, March 24th, 2014
Jim “Lazer” HahnDavid Ward
Schedule1. Overview2. Hands-on with responsive templates 3. Small Group App Design4. Presentations5. Debrief
OverviewGoals• Investigate responsive web/mobile app design
strategies• Develop experience retrieving and displaying library
API data• Discuss methodologies for student/patron-led library
application design methodologies
OverviewBackground• Funded by 2 year IMLS National Leadership Grant• Experimented with multiple strategies for student-
driven library application design• Focused on identifying library data patrons consider
important• Created design architectures that valued portability
and reusability of application components
Minrva
Hands-on• Templates uploaded to Box• https://app.box.com/s/fxsfrsezvc29n1f7gdzu • Technologies used:– Bootstrap 3– jQuery 1.11.0– JSONP API data powered by Java backend
Hands-onResponsive grid column layout scheme• Write once, deploy everywhere• Think mobile first• Design to add, not cut• Before you code:– What are the primary functions of app? – What is the app workflow for each function?– What is the product or outcome of each function?
Hands-onSuggest Activities:• Experiment with dynamically retrieving library data• Update visual display based on user input• Show/hide items based on screen width– Extra small devices Phones (<768px) – Small devices Tablets (≥768px) – Medium devices Desktops (≥992px) – Large devices Desktops (≥1200px)
University of Toronto Catalogue – Desktop http://search.library.utoronto.ca/ 03/10/2014
University of Toronto Catalogue – Mobile http://search.library.utoronto.ca/ 03/10/2014
Grand Valley State University Libraries – Desktop http://www.gvsu.edu/library/ 03/11/2014
Grand Valley State University Libraries – Mobile http://www.gvsu.edu/library/ 03/11/2014
Duke University Libraries – Desktophttp://library.duke.edu/ 03/11/2014
Duke University Libraries – Mobilehttp://library.duke.edu/ 03/11/2014
Minrva Web Services
API Documentation• http://minrvaproject.org/services.php
• All feeds output from this path:Minrva-dev.library.illinois.edu/api/
Sample Response from api/tech/list
Small Group App Design• Code Camp Methodology• Discuss app ideas with attendees• Form small groups based on interest• Code!
Small Group App Design
Small Group App Design
DogEar• Events• Community – class
member chat
stacks• Scanner
enhancements• Connect to non-
library items (e.g. bookstores)
Study Buddy• Four Squarization of
library experience• Operational unit is
course, not library• Connect students
within same courses
iStudy• Rate and review
loanable technology• Ask for feedback at
critical junctures like discharging, renewing
• “Noise-o-Meter”
MyIllinois• Personalization –
user search history, favorite library, etc.
• Availability of physical resources (e.g. computers)
I+Library• Push availability
updates• Ratings• User Interface
API Info – Part 1Minrva Services• Docs: http://minrvaproject.org/services_catalog.php
API base URI:• minrva-dev.library.illinois.edu/api/
Rooms Availability• Docs: http://dunatis.grainger.uiuc.edu/rooms
• API base URI: http://minrva-dev.library.illinois.edu:8080/roomreserve/roomreserve
API Info – Part 2Study Buddy• Docs: http://dunatis.grainger.uiuc.edu:8080/sb/
• API base URI: http://dunatis.grainger.uiuc.edu:8080/sb/api/
Box documentshttps://app.box.com/s/fxsfrsezvc29n1f7gdzu
Presentations
Discussion and Questions• Jim Hahn [email protected]• David Ward [email protected]
