Mobile orimmobile?(responsive design, cookies and kiosks)HTML5 and CSS3: Ready for Prime Time?,An Amigos Online Conference...
What to expect in the next hour or so1.   An introduction (this slide), followed by a little bit about the people involved...
(me, Margo Kabel and Juan Francisco Reyes)
Can you build us a mobile..."something?"                          photo by flicker user statelibrarynsw
Stormtroopers all look, and act, the same.Mobile websites shouldnt.                                 photo by flicker user ...
Your users are unique snowflakes.Take some time to get to know them.                             photo by flicker user yel...
How will this new feature solve anexisting problem?                              photo by flicker user yelllowcloud
Does this solution make sense for thedevice they are using?                             photo by flicker user yelllowcloud
Do user needs assessmenton the cheep cheap.                           photo by flicker user reubeninstt
Focus groups:use a student and run them for free!*                              photo by flicker user usaghumphreys
Gamestorming: design the box
Whiteboards: conduct polls in real time
Frameworks: read some onlinedocumentation, feel like an expert.
Besides a jQM framework, what else isunder the hood?
JavaScript and JSON
JavaScript and JSON... along withColdFusion,
JavaScript and JSON... along withColdFusion, XML
JavaScript and JSON... along withColdFusion, XML and the ALEPH api
photo by flicker user Nels_P_Olsen
Resources we used and our codeAll our code is belong to you: github.com/whelmanHead first html5 programing. http://www.wor...
Thank you.Find this presentation at: slideshare.net/whelmanWilliam Helman    twitter.com/thinkpol    http://whelman.com
Mobile or immobile? (responsive design, cookies and kiosks) html5css3
Mobile or immobile? (responsive design, cookies and kiosks) html5css3
Mobile or immobile? (responsive design, cookies and kiosks) html5css3
Mobile or immobile? (responsive design, cookies and kiosks) html5css3
Mobile or immobile? (responsive design, cookies and kiosks) html5css3
Mobile or immobile? (responsive design, cookies and kiosks) html5css3
Mobile or immobile? (responsive design, cookies and kiosks) html5css3
Mobile or immobile? (responsive design, cookies and kiosks) html5css3
Mobile or immobile? (responsive design, cookies and kiosks) html5css3
Upcoming SlideShare
Loading in...5
×

Mobile or immobile? (responsive design, cookies and kiosks) html5css3

1,071

Published on

When recently tasked with simultaneously developing both mobile web and iPad kiosk interfaces we turned to responsive design, jQuery Mobile and some javascript trickery to make one web app both mobile and immobile. This session will talk about some of the user driven design process we used, the flexibility of jQM and how we used the canvas tag to power our book locator.

Published in: Education
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
1,071
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
3
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Mobile or immobile? (responsive design, cookies and kiosks) html5css3

  1. 1. Mobile orimmobile?(responsive design, cookies and kiosks)HTML5 and CSS3: Ready for Prime Time?,An Amigos Online Conference,8 February, 2013Bill Helman,Integrated Digital Services Librarian,University of Baltimore Langsdale Librarytwitter.com/thinkpolslideshare.net/whelman photo by flicker user His Sad Shadow
  2. 2. What to expect in the next hour or so1. An introduction (this slide), followed by a little bit about the people involved in the kiosk project, and a look at the kiosks in the wild2. Background on the user centered design approach we took3. Why we went with an HTML5 framework (and some of the other choices for whats under the hood)4. Well take a look at the responsive site that the backbone of the kiosk5. The devilish trickery we used to immobilize our mobile site6. Take a look at some code and share our link to it on GitHub photo by flicker user leynik
  3. 3. (me, Margo Kabel and Juan Francisco Reyes)
  4. 4. Can you build us a mobile..."something?" photo by flicker user statelibrarynsw
  5. 5. Stormtroopers all look, and act, the same.Mobile websites shouldnt. photo by flicker user jdhancock
  6. 6. Your users are unique snowflakes.Take some time to get to know them. photo by flicker user yelllowcloud
  7. 7. How will this new feature solve anexisting problem? photo by flicker user yelllowcloud
  8. 8. Does this solution make sense for thedevice they are using? photo by flicker user yelllowcloud
  9. 9. Do user needs assessmenton the cheep cheap. photo by flicker user reubeninstt
  10. 10. Focus groups:use a student and run them for free!* photo by flicker user usaghumphreys
  11. 11. Gamestorming: design the box
  12. 12. Whiteboards: conduct polls in real time
  13. 13. Frameworks: read some onlinedocumentation, feel like an expert.
  14. 14. Besides a jQM framework, what else isunder the hood?
  15. 15. JavaScript and JSON
  16. 16. JavaScript and JSON... along withColdFusion,
  17. 17. JavaScript and JSON... along withColdFusion, XML
  18. 18. JavaScript and JSON... along withColdFusion, XML and the ALEPH api
  19. 19. photo by flicker user Nels_P_Olsen
  20. 20. Resources we used and our codeAll our code is belong to you: github.com/whelmanHead first html5 programing. http://www.worldcat.org/oclc/706018590Head first mobile web. http://www.worldcat.org/oclc/744291335Gamestorming: A playbook for innovators, rulebreakers,and changemakers. http://www.worldcat.org/oclc/471816034jQuery Mobile: http://jquerymobile.com (this is an awesomesite to get you up and running)
  21. 21. Thank you.Find this presentation at: slideshare.net/whelmanWilliam Helman twitter.com/thinkpol http://whelman.com
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×