Project 4: Mobile/Tablet DesignGreg Wendt

This is a presentation to 800 Charity Cars.

Charity Cars already has a mobile website but I’m presenting it to them as if they did not yet have one and as though the HTML

was not written in the most current version.

• Mobile internet usage is passing up desktop usage and is expected to keep increasing

• It is imperative for businesses to keep up with its growth

• Does your website work properly on mobile devices?

• It can… with a re-design!

• Versatility is key in keeping up-to-date with web growth

• Adaptability to many platforms and devices

• Accessibility by abled or disabled persons

• User experience (UX) -

Versatility

• Small screens

• Big screens

• Different browsers

Adaptability

Auto electronics

Accessibility

• Visual Impairment

• Mobility or Dexterity Impairment

• Auditory Impairment

• Cognitive Impairment

What does this mean for 800 Charity Cars?

• An updated website design that includes functionality for all desktop and mobile devices and keeping it current with new technologies as they emerge

• Budgeting for redesign and maintenance

A Bad Example

As the screen gets smaller, parts of the image disappear.

A Good Example

What can 800 Charity Cars do to improve the UX of its website users?

• Responsive Design

• Design the website for “all devices” so that problems are eliminated and UX is optimized

Resources• http://inospy.com/wp-content/uploads/2014/09/smartphone-and-tablet.png

• http://smallbiztrends.com/wp-content/uploads/2013/04/multitasking-mobile-devices-557x362.jpg

• http://media.dmnews.com/images/2010/06/21/mobile_sidebar_107416.jpg

• http://readwrite.com/2013/12/20/mobile-smartwatches-google-glass-apple-android-ios-2014-predictions#awesm=~orayyv7zFmY3vy

• http://www.google.com/think/multiscreen/whitepaper-multiscreenconsumer.html

• http://intrigueme.ca/wp-content/uploads/2013/04/Mobile-Unfriendly-Website.jpg

• http://ezmarkup.com/themes/ezm2012/images/img-guide17.jpg

• http://dlvawu55mhqnf.cloudfront.net/wp-content/uploads/2014/03/responsive-web-design.png

• http://pictures.topspeed.com/IMG/crop/200910/2010-acura-tl-1_600x0w.jpg

• http://cdn.articulate.com/images/blogs/rel/uploads/2009/06/fontsy2.jpg

• http://www.ncadv.org/images/800%20Charity%20Cars.gif

• http://www.cruxcollaborative.com/wp-content/uploads/2013/12/mobile-statistic-infographic-2.png

• http://netdna.copyblogger.com/images/responsive-screenshots.jpg

• http://www.copyblogger.com/mobile-responsive-design-101/

• www.800charitycars.com