Loading presentation...

Present Remotely

Send the link below via email or IM

Copy

Present to your audience

Start remote presentation

  • Invited audience members will follow you as you navigate and present
  • People invited to a presentation do not need a Prezi account
  • This link expires 10 minutes after you close the presentation
  • A maximum of 30 users can follow your presentation
  • Learn more about this feature in our knowledge base article

Do you really want to delete this prezi?

Neither you, nor the coeditors you shared it with will be able to recover it again.

DeleteCancel

Make your likes visible on Facebook?

Connect your Facebook account to Prezi and let your likes appear on your timeline.
You can change this under Settings & Account at any time.

No, thanks

Mobile User Experience

No description
by

on 20 October 2013

Comments (0)

Please log in to add your comment.

Report abuse

Transcript of Mobile User Experience

Mobile User Experience
There are a lot of new devices with
different screen resolutions that
are visiting websites all the time.
This has influenced the mobile
web browsing experience.
by Kong Yik Hong
(Mobify, 2012)
Mobile Movement
New devices such as
smartphones and tablets on
the market are increasing
dramatically. Mobile users
would more than desktop
users in 2014.
(Minato, 2012)
“Google recommends webmasters
follow the industry best practice of
using responsive web design, namely
serving the same HTML for all devices
and using only CSS media queries to
decide the rendering on each
device.”
-

Google (2012)
Introduction
I am passionate about web design. For me, mobile user experience is a new and interesting topic.

Nowadays, mobile phones are much more than making calls and sending messages. Mobile devices provide new interactive experience for the user.
• • •
Introduction
Mobile Movement
Multi-Screen Behavior
User Experience
Responsive Web Design
Further Exploration
Conclusion
Bibliography
• • •
Contents
Multi-Screen
Behavior
90% of people move between devices
to
accomplish a goal
, whether that’s on
smartphones, PCs, tablets or TV.

The device we choose to use is often
driven by our context
: where we are,
what we want to accomplish and the
amount of time needed.

Smartphones are the backbone
of our
daily media use. They are the devices
used most throughout the day and serve
as the most common starting point for
activities across multiple screens.
(Google, 2012)
Bibliography
“Building Mobile-Optimized Websites” (2012) https://developers.google.com/webmasters/smartphone-sites/

Buxton, B. (2007) Sketching user experiences: getting the design right and the right design, Morgan Kaufmann, San Francisco.

"Creating a Compelling Mobile User Experience" (2012) http://www-935.ibm.com/services/uk/cio/pdf/Mobile_UX_Whitepaper_02May12_VK.pdf

“ComScore: Mobile Will Force Desktop Into Its Twilight In 2014” (2012) http://www.businessinsider.com/mobile-will-eclipse-desktop-by-2014-2012-6

“Global Screen Size Diversity Infographic: Sizing Up Man's New Best Friend” (2012) http://www.mobify.com/blog/global-screen-size-diversity/

“INFOGRAPHIC: 2013 The Year of Responsive Design” (2012) http://www.uberflip.com/blog/infographic-2013-the-year-of-responsive-design

McNeil, Patrick (2013) The web designer’s idea book, vol. 3, HOW Books, Cincinnati.

Polacek, John (n.d.) One site for every screen. [online image] Available at: http://johnpolacek.github.io/scrolldeck.js/decks/responsive/ [Accessed 17th May, 2013]

Moggridge, B. and Smith, G.C. (2007) Designing interactions, The MIT Press, London.

"The New Multi-Screen World Study" (2012) http://www.google.com/think/research-studies/the-new-multi-screen-world-study.html
Conclusion
A good user experience requires the understanding of many factors, including human behavior, interaction design and technology.

Furthermore, we should understand the context in which it will be used. And then design an appropriate interface for users to interact with information.
http://d.alistapart.com/responsive-web-design/ex/ex-site-flexible.html
Example
CSS3
Media Queries
Flexible Images
Fluid
Grid Layout
Responsive techniques:
Key benefits (Sanchez, 2012):
Cross Platform
Content Focused
Easy To Manage
SEO Friendly
Cost Effective
Future Proof
Responsive Web Design
Responsive web design is the approach of designing website that respond to the user’s environment based on devices and platforms.

McNeil (2013, p.2) notes that technology is changing web design trends, styles and techniques. Indeed,
HTML5
and
CSS3
are the new web standard. However, this technology should fit easily into people's everyday lives, making sure what people need. (Moggridge and Smith, 2007)
Always be relevant
Contain the right content in the right way.

Keep it simple
Simplicity, efficiency and elegance can set you apart from the competition.

Build richer experiences
The intelligent combination of what your app or mobile site can offer with applications and data already on the mobile device.

Think innovation
Be aware of the continually developing context of the modern, mobile, always on and socially connected lifestyle.
Optimize content for mobile
An approach that balances recognized usability heuristics with the need for rich mobile functionality.

The end-to-end experience
Content and functionality that are delivered on each of your channels must be in line with what users actually want to do.

Be more social
Mobile users now spend more time on social networks than PC users do.

Smart evolution
Advances in technology, new industry trends, differing business requirements and feedback from your users.
User Experience
(IBM Corporation, 2012)
“Experience is a very dynamic,
complex and subjective phenomenon.
It depends upon the perception of
multiple sensory qualities of a design,
interpreted through filters relating to
contextual factors.”
- Buchenau and
Suri (2000 cited in Buxton, 2007 p.135)
Further Exploration
With the technology of HTML5 and CSS3, the website can automatically adapt to any device’s screen resolution. We should start building websites that are future proof.
(Polacek, n.d.)
Full transcript