0
D’arce HessDeveloper, Athlete and MusicianPixelMillBlog: www.thebrandingbutterfly.comWebsite: www.pixelmill.comEmail: dhes...
Developing        SharePoint  SharePoint      Branding and UIsolutions since     Specialists     2004Developer of         ...
Have you looked up awebsite on your mobiledevice and had to pinch thescreen to expand thecontent to reach theinformation y...
Steps to Mobile Recovery1. Is this you?2. Admit you have a UI/UX   problem3. Seek help4. Have better experience
Users accessedinformation using asingle device.Used Keyboard and amouse to deliver userexperience.
•   Allowed for individual         •   Required users to maintain    masterpages to target              multiple masterpag...
Named by Steve Champeon in2003.Focuses on Content firstNot a good fit for SharePointsince SharePoint starts witha desktop ...
 Ethan Marcotte coined the term responsive web design (RWD) in a May  2010 article in A List Apart. Uses fluid grids and...
The fluid grid system uses percentsinstead of pixels for column widthsensuring proper proportions for key screenresolution...
Desktop View               Phone ViewTablet View
Here are some common break points to use for your RWDsites 320 px — Mobile portrait 480 px — Mobile landscape 600 px — Sma...
Adaptive – “Serving orAble to adapt, likethe coloring of achameleon.”
Focuses more on presentationthan on content.Items may selected to be hiddenor not presented as screen widthdecreases. i.e....
Desktop   Tablet   Mobile
The Mobile Revolution
The Mobile Revolution
The Mobile Revolution
The Mobile Revolution
The Mobile Revolution
The Mobile Revolution
The Mobile Revolution
The Mobile Revolution
The Mobile Revolution
The Mobile Revolution
The Mobile Revolution
The Mobile Revolution
The Mobile Revolution
The Mobile Revolution
The Mobile Revolution
The Mobile Revolution
The Mobile Revolution
The Mobile Revolution
The Mobile Revolution
The Mobile Revolution
The Mobile Revolution
The Mobile Revolution
The Mobile Revolution
The Mobile Revolution
Upcoming SlideShare
Loading in...5
×

The Mobile Revolution

642

Published on

The Mobile Revolution

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

  • Be the first to like this

No Downloads
Views
Total Views
642
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
13
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Transcript of "The Mobile Revolution"

  1. 1. D’arce HessDeveloper, Athlete and MusicianPixelMillBlog: www.thebrandingbutterfly.comWebsite: www.pixelmill.comEmail: dhess@pixelmill.com @darcehess www.linkedin.com/in/darcehess/ http://www.youtube.com/user/DarceHess
  2. 2. Developing SharePoint SharePoint Branding and UIsolutions since Specialists 2004Developer of YourCost effective SharePoint SharePoint Branding Templates Experts
  3. 3. Have you looked up awebsite on your mobiledevice and had to pinch thescreen to expand thecontent to reach theinformation you need?
  4. 4. Steps to Mobile Recovery1. Is this you?2. Admit you have a UI/UX problem3. Seek help4. Have better experience
  5. 5. Users accessedinformation using asingle device.Used Keyboard and amouse to deliver userexperience.
  6. 6. • Allowed for individual • Required users to maintain masterpages to target multiple masterpages in order specific devices. to provide unified experience• Allowed for a unique viewing for users. experience • Only available in SharePoint 2013 Publishing Sites. • Can have a maximum of 10 device channels.
  7. 7. Named by Steve Champeon in2003.Focuses on Content firstNot a good fit for SharePointsince SharePoint starts witha desktop view first.
  8. 8.  Ethan Marcotte coined the term responsive web design (RWD) in a May 2010 article in A List Apart. Uses fluid grids and CSS3 Media Queries to adjust layout as screen width decreases. The fluid grid concept calls for page element sizing to be in relative units like percentages, but can also use pixels or points. All content remains and adjusts to the screen width
  9. 9. The fluid grid system uses percentsinstead of pixels for column widthsensuring proper proportions for key screenresolutions and devices.
  10. 10. Desktop View Phone ViewTablet View
  11. 11. Here are some common break points to use for your RWDsites 320 px — Mobile portrait 480 px — Mobile landscape 600 px — Small tablet 768 px — Tablet portrait 1024 px — Tablet landscape/Netbook 1280 px & greater — Desktop
  12. 12. Adaptive – “Serving orAble to adapt, likethe coloring of achameleon.”
  13. 13. Focuses more on presentationthan on content.Items may selected to be hiddenor not presented as screen widthdecreases. i.e. Banner images orcolumns.
  14. 14. Desktop Tablet Mobile
  1. A particular slide catching your eye?

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

×