SlideShare a Scribd company logo
1 of 55
Mobile First: 2 problémy, 2 příležitosti
                         La Degustation Online, 20. 6. 2012



                              By @soundake




čtvrtek, 21. června 12
čtvrtek, 21. června 12

Jsem designer, protože mě hrozně štvou věci, který jsou zbytečně složitý a chci mít tu
možnost dělat věci co nejjednodušší, jak jen to jde.
čtvrtek, 21. června 12

Jsem designer, protože mě hrozně štvou věci, který jsou zbytečně složitý a chci mít tu
možnost dělat věci co nejjednodušší, jak jen to jde.
http://www.flickr.com/photos/61229509@N03/5839275322/

čtvrtek, 21. června 12

Dnes bych vám chtěl říct o dvou velkých problémech, které s sebou přináší návrh pro mobilní
zařízení,
http://www.flickr.com/photos/93008522@N00/253953566/




čtvrtek, 21. června 12

a které jsou zároveň obrovskou příležitostí pro skvělý design aplikace, prezentace či služby.
čtvrtek, 21. června 12

Chtěl bych, abyste si z dnešního večera odnesli tři věci:
“You are great lover!”




čtvrtek, 21. června 12

Návrh pro mobilní zařízení dokáže zlepšit uživatelskou zkušenost i na velkém webu.
http://www.flickr.com/photos/94588149@N00/4758676577/

čtvrtek, 21. června 12

Návrh pro mobilní zařízení vám dokáže ušetřit či dokonce vydělat i nějaké peníze.
http://www.flickr.com/photos/44083360@N00/6157683097/

čtvrtek, 21. června 12

Občas jsou omezení super.
http://www.flickr.com/photos/8269775@N05/4341633116/

čtvrtek, 21. června 12

Problém první - prostor.
čtvrtek, 21. června 12

Kdo tu děláte weby? A děláte weby i pro mobilní zařízení?
čtvrtek, 21. června 12

Znáte to, na běžnou webovou stránku se vejde hromada věcí. Někdy se dokonce stane, že se
někde na stránce objeví prázdné místo a hned se značíme tam něco vrazit. Přeci tam nebude
díra!
1024 x 768px



čtvrtek, 21. června 12

Už nějakých 10 let se průměrné rozlišení počítačů pohybuje kolem 1024x768px. A chytré
telefony kterých je čím dál víc (za rok či dva jich prý bude více jak počítačů), tak mají rozlišení
pětinové. Pouhých 20% plochy obrazovky.
1024 x 768px


                                                                        320 x 480 px

                                                                             20%

čtvrtek, 21. června 12

Už nějakých 10 let se průměrné rozlišení počítačů pohybuje kolem 1024x768px. A chytré
telefony kterých je čím dál víc (za rok či dva jich prý bude více jak počítačů), tak mají rozlišení
pětinové. Pouhých 20% plochy obrazovky.
Na smartfounu tedy nebudete mít díru nikdy. Budete řešit opačný problém - moc věcí, které
tam potřebujete dát.
čtvrtek, 21. června 12

Flickr znáte? Služba pro sdílení fotek.
čtvrtek, 21. června 12

Jen v menu se skrývá přes 60 položek. Jak tohle sakra dostali do mobilu? Udělali
jednoduchou věc. Vyškrtali všechno co není potřeba a nechali jen to, co skutečně
potřeba je. Jádro aplikace, to co lidé nejvíce používají, za čím tam chodí.
čtvrtek, 21. června 12

Jen v menu se skrývá přes 60 položek. Jak tohle sakra dostali do mobilu? Udělali
jednoduchou věc. Vyškrtali všechno co není potřeba a nechali jen to, co skutečně
potřeba je. Jádro aplikace, to co lidé nejvíce používají, za čím tam chodí.
čtvrtek, 21. června 12

Jen v menu se skrývá přes 60 položek. Jak tohle sakra dostali do mobilu? Udělali
jednoduchou věc. Vyškrtali všechno co není potřeba a nechali jen to, co skutečně
potřeba je. Jádro aplikace, to co lidé nejvíce používají, za čím tam chodí.
čtvrtek, 21. června 12

Jen v menu se skrývá přes 60 položek. Jak tohle sakra dostali do mobilu? Udělali
jednoduchou věc. Vyškrtali všechno co není potřeba a nechali jen to, co skutečně
potřeba je. Jádro aplikace, to co lidé nejvíce používají, za čím tam chodí.
čtvrtek, 21. června 12

Jen v menu se skrývá přes 60 položek. Jak tohle sakra dostali do mobilu? Udělali
jednoduchou věc. Vyškrtali všechno co není potřeba a nechali jen to, co skutečně
potřeba je. Jádro aplikace, to co lidé nejvíce používají, za čím tam chodí.
čtvrtek, 21. června 12

Jen v menu se skrývá přes 60 položek. Jak tohle sakra dostali do mobilu? Udělali
jednoduchou věc. Vyškrtali všechno co není potřeba a nechali jen to, co skutečně
potřeba je. Jádro aplikace, to co lidé nejvíce používají, za čím tam chodí.
čtvrtek, 21. června 12

Jen v menu se skrývá přes 60 položek. Jak tohle sakra dostali do mobilu? Udělali
jednoduchou věc. Vyškrtali všechno co není potřeba a nechali jen to, co skutečně
potřeba je. Jádro aplikace, to co lidé nejvíce používají, za čím tam chodí.
čtvrtek, 21. června 12

Mají tam těch položek 5.
čtvrtek, 21. června 12

Malý prostor je úžasné omezení pro každého designera, protože malý prostor vás donutí
zjednodušovat, donutí vás skutečně zapřemýšlet nad tím co prioritu má a co prioritu nemá.
Sednout si, přemýšlet, škrtat, zjednodušovat.
http://www.flickr.com/photos/19743256@N00/2224073271/




čtvrtek, 21. června 12

Zaměřit se na problém
čtvrtek, 21. června 12

Antoine de Saint-Exupery řekl jednu geniální větu: "Dokonalosti je dosaženo, nikoliv
když již nelze nic víc přidat, ale když není již možné nic odebrat."
Vydělává peníze



čtvrtek, 21. června 12

Ono to má ještě jednu souvislost a to souvislost s byznysem. Vy se díky tomu, že se při
návrhu soustředíte na to podstatné, soustředíte tedy na to co, vám vlastně vydělává peníze.
Ta služba, kterou nabízí, produkt, který prodáváte, to je to co lidí vlastně u vás chtějí. A
můžete v klidu zapomenout na balast kolem. Nevyhazujte peníze za něco, co nikdo moc
neocení.
čtvrtek, 21. června 12

Postupme ještě o krok dál. Zpátky na web. Ukažme si příklad, jak vám návrh pro mobil
pomůže s velkým webem.
čtvrtek, 21. června 12

Statefarm je americká pojišťovna.
čtvrtek, 21. června 12

Ještě v loňském roce vypadal jejich web nějak takto. Velký banner s bílým nečitelným textem,
usměvavý pán, hromada divných obdélníků, v menu mraky věcí.
čtvrtek, 21. června 12

Pak udělali mobilní verzi. Na prvním místě - založení pojištění. Jádro jejich bysnysu. V
druhém sledu nalezení agenta a hlášení škod.Pomoc v nouzi a pak nabídka dalších pojištění.
5 věcí! Tj. nejčastější věci, které u nich uživatelé řeší.
čtvrtek, 21. června 12

A tuhle zkušenost oni aplikovali i na web. Na první místě sjednání po jištění, hned vedle
kontakt a hlášení pojistné události. Pod tím nabídka dalších pojištění. Stejný pattern
čtvrtek, 21. června 12

Spíše perlička. Webový designer Jeffrey Zeldman zašel při návrhu svého nového webu ještě o
krok dál. Vlastně zůstal v kroku prvním.

Jeffrey Zeldman - A List Apart - Designing with Web Standards
čtvrtek, 21. června 12

Udělal svůj web Mobile Only. Taky způsob :)
čtvrtek, 21. června 12

1:1
http://www.flickr.com/photos/73491156@N00/380316678/

čtvrtek, 21. června 12

Druhý problém - rychlost
čtvrtek, 21. června 12

Druhou věcí, krom malé obrazovky, se kterou se musíte na mobilu vypořádat je, že jsou to
zařízení pomalá. Mají pomalejší připojení k Internetu, mají pomalejší vykreslování stránek,
pomalejší vykreslování Javascriptu atd. Tudíž, aby byla vaše webová stránka na mobilu
použitelná, tak musí být v prvé řadě rychlá. Stránka se musí rychle načíst, musí se rychle
vykreslit, všechny prvky, které na ní jsou musí na uživatele reagovat bleskově.
Miller, R. B. (1968). Response time in man-computer conversational transactions. Proc. AFIPS Fall Joint Computer Conference Vol. 33, 267-277

čtvrtek, 21. června 12

Protože použitelnost velmi souvisí s rychlostí, což už je známo přes 40 let.
R.B.Miller - 1968 - Response time in man-computer conversational transactions
Speed is best feature
   http://pacepirate.tumblr.com/post/23988387164

čtvrtek, 21. června 12

Dá se říct, že rychlost je ta nejlepší funkce, kterou svým uživatelům můžete dopřát. A jakmile
dokážete optimalizovat vaší stránku na mobilním zařízení, představte si, jak úžasně rychlá
bude na uživatelově notebooku či stolním počítači.
http://www.flickr.com/photos/72296542@N00/382441387/

čtvrtek, 21. června 12

Vaši uživatelé budou jednoduše nadšeni. A o to tu jde, ne?
“Mobile experiences fill the gaps while we wait. Nobody
      wants to wait while we wait.” - Mike Krieger, Co-founder
                            Instagram
čtvrtek, 21. června 12

Lidé velmi často používají mobilní zařízení, když čekají a nikdo nechce čekat, když čeká.
http://www.flickr.com/photos/12836528@N00/6575053747/

čtvrtek, 21. června 12

A zase to má vliv i na byznys.
100ms zpoždění při vypisování výsledků vygeneruje ročně 1%
                           ztrátu. Což je zhruba 200 milionů dolarů ročně.


                           400ms zpoždění výsledků sníží o 5-9% celkový provoz na
                           stránkách.


                           500ms zpoždění snižuje provoz ve vyhledávači o 20%.


                           1s zpoždění výsledků snižuje příjem o 4%.


                           10% nejrychlejších uživatelů zůstává na stránkách o 50% déle než
                           10% uživatelů pomalých.




   Sources: slideshare.net/stubbornella/designing-fast-websites-presentation & slideshare.net/markstanton/speed-matters

čtvrtek, 21. června 12

 Studie za studií potvrzují, že nedostatečná rychlost vašeho webu vás může připravit o slušné
příjmy.
Amazon - 100ms zpoždění při vypisování výsledků vygeneruje ročně 1% ztrátu. Což je
zhruba 200 milionů dolarů ročně.
Yahoo - 400ms zpoždění výsledků sníží o 5-9% celkový provoz na stránkách
Google - 500ms zpoždění snižuje provoz ve vyhledávači o 20%.
Bing - 1s zpoždění výsledků snižuje příjem o 4%
AOL 10% nejrychlejších uživatelů zůstává na stránkách o 50% déle než 10% uživatelů
pomalých.
http://www.flickr.com/photos/92921037@N00/5532840143/

čtvrtek, 21. června 12

Když navrhujete weby pro mobilní zařízení, tak se musíte vyrovnat se dvěma velkými
problémy: malá obrazovka a pomalé načítání stránek. Jsou to dva problémy a zároveň skvělé
příležitosti, jak vytvořit příjemnou a svižnou prezentaci či službu.
čtvrtek, 21. června 12

Když navrhujete weby pro mobilní zařízení, tak se musíte vyrovnat se dvěma velkými
problémy: malá obrazovka a pomalé načítání stránek. Jsou to dva problémy a zároveň skvělé
příležitosti, jak vytvořit příjemnou a svižnou prezentaci či službu.
http://www.flickr.com/photos/92921037@N00/5532840143/
čtvrtek, 21. června 12

Zapamatujte si tedy, že:
“Yes, I am...”




čtvrtek, 21. června 12

Návrh pro mobilní zařízení dokáže zlepšit uživatelskou zkušenost i na velkém webu.
Máte méně funkcí, které jsou ale zatraceně rychlé a vymazlené.
http://www.flickr.com/photos/94588149@N00/4758676577/

čtvrtek, 21. června 12

Návrh pro mobilní zařízení vám dokáže ušetřit či dokonce vydělat i nějaké peníze.
Zaměříte se na to, co vám peníze vydělává a kde jenom utrácíte.
http://www.flickr.com/photos/44083360@N00/6157683097/

čtvrtek, 21. června 12

Občas jsou omezení super.
Máte prostě méně věcí, o které se musíte starat. A naopak je může vyladit k dokonalosti.
http://www.flickr.com/photos/95572727@N00/4317572931/

čtvrtek, 21. června 12

Až zítra ráno přijdete do práce můžete zkusit následující:
1

                         Představte si svůj
                          web na mobilu

čtvrtek, 21. června 12

Koukněte se na váš web a představte si ho na mobilu.
2

                         Začněte řezat


čtvrtek, 21. června 12

Začněte ho řezat.
3

                         Optimalizujte


čtvrtek, 21. června 12

Začněte optimalizovat jeho kód.
čtvrtek, 21. června 12
@soundake

                         http://soundake.cz/




                          http://symbio.cz/



čtvrtek, 21. června 12

More Related Content

Featured

Everything You Need To Know About ChatGPT
Everything You Need To Know About ChatGPTEverything You Need To Know About ChatGPT
Everything You Need To Know About ChatGPTExpeed Software
 
Product Design Trends in 2024 | Teenage Engineerings
Product Design Trends in 2024 | Teenage EngineeringsProduct Design Trends in 2024 | Teenage Engineerings
Product Design Trends in 2024 | Teenage EngineeringsPixeldarts
 
How Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental HealthHow Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental HealthThinkNow
 
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
AI Trends in Creative Operations 2024 by Artwork Flow.pdfAI Trends in Creative Operations 2024 by Artwork Flow.pdf
AI Trends in Creative Operations 2024 by Artwork Flow.pdfmarketingartwork
 
PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024Neil Kimberley
 
Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)contently
 
How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024Albert Qian
 
Social Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie InsightsSocial Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie InsightsKurio // The Social Media Age(ncy)
 
Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024Search Engine Journal
 
5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summarySpeakerHub
 
ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd Clark Boyd
 
Getting into the tech field. what next
Getting into the tech field. what next Getting into the tech field. what next
Getting into the tech field. what next Tessa Mero
 
Google's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search IntentGoogle's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search IntentLily Ray
 
Time Management & Productivity - Best Practices
Time Management & Productivity -  Best PracticesTime Management & Productivity -  Best Practices
Time Management & Productivity - Best PracticesVit Horky
 
The six step guide to practical project management
The six step guide to practical project managementThe six step guide to practical project management
The six step guide to practical project managementMindGenius
 
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...RachelPearson36
 
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...Applitools
 

Featured (20)

Everything You Need To Know About ChatGPT
Everything You Need To Know About ChatGPTEverything You Need To Know About ChatGPT
Everything You Need To Know About ChatGPT
 
Product Design Trends in 2024 | Teenage Engineerings
Product Design Trends in 2024 | Teenage EngineeringsProduct Design Trends in 2024 | Teenage Engineerings
Product Design Trends in 2024 | Teenage Engineerings
 
How Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental HealthHow Race, Age and Gender Shape Attitudes Towards Mental Health
How Race, Age and Gender Shape Attitudes Towards Mental Health
 
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
AI Trends in Creative Operations 2024 by Artwork Flow.pdfAI Trends in Creative Operations 2024 by Artwork Flow.pdf
AI Trends in Creative Operations 2024 by Artwork Flow.pdf
 
Skeleton Culture Code
Skeleton Culture CodeSkeleton Culture Code
Skeleton Culture Code
 
PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024PEPSICO Presentation to CAGNY Conference Feb 2024
PEPSICO Presentation to CAGNY Conference Feb 2024
 
Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)
 
How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024
 
Social Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie InsightsSocial Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie Insights
 
Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024
 
5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary
 
ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd
 
Getting into the tech field. what next
Getting into the tech field. what next Getting into the tech field. what next
Getting into the tech field. what next
 
Google's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search IntentGoogle's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search Intent
 
How to have difficult conversations
How to have difficult conversations How to have difficult conversations
How to have difficult conversations
 
Introduction to Data Science
Introduction to Data ScienceIntroduction to Data Science
Introduction to Data Science
 
Time Management & Productivity - Best Practices
Time Management & Productivity -  Best PracticesTime Management & Productivity -  Best Practices
Time Management & Productivity - Best Practices
 
The six step guide to practical project management
The six step guide to practical project managementThe six step guide to practical project management
The six step guide to practical project management
 
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
 
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
 

Mobile first: 2 problémy, 2 příležitosti

  • 1. Mobile First: 2 problémy, 2 příležitosti La Degustation Online, 20. 6. 2012 By @soundake čtvrtek, 21. června 12
  • 2. čtvrtek, 21. června 12 Jsem designer, protože mě hrozně štvou věci, který jsou zbytečně složitý a chci mít tu možnost dělat věci co nejjednodušší, jak jen to jde.
  • 3. čtvrtek, 21. června 12 Jsem designer, protože mě hrozně štvou věci, který jsou zbytečně složitý a chci mít tu možnost dělat věci co nejjednodušší, jak jen to jde.
  • 4. http://www.flickr.com/photos/61229509@N03/5839275322/ čtvrtek, 21. června 12 Dnes bych vám chtěl říct o dvou velkých problémech, které s sebou přináší návrh pro mobilní zařízení,
  • 5. http://www.flickr.com/photos/93008522@N00/253953566/ čtvrtek, 21. června 12 a které jsou zároveň obrovskou příležitostí pro skvělý design aplikace, prezentace či služby.
  • 6. čtvrtek, 21. června 12 Chtěl bych, abyste si z dnešního večera odnesli tři věci:
  • 7. “You are great lover!” čtvrtek, 21. června 12 Návrh pro mobilní zařízení dokáže zlepšit uživatelskou zkušenost i na velkém webu.
  • 8. http://www.flickr.com/photos/94588149@N00/4758676577/ čtvrtek, 21. června 12 Návrh pro mobilní zařízení vám dokáže ušetřit či dokonce vydělat i nějaké peníze.
  • 11. čtvrtek, 21. června 12 Kdo tu děláte weby? A děláte weby i pro mobilní zařízení?
  • 12. čtvrtek, 21. června 12 Znáte to, na běžnou webovou stránku se vejde hromada věcí. Někdy se dokonce stane, že se někde na stránce objeví prázdné místo a hned se značíme tam něco vrazit. Přeci tam nebude díra!
  • 13. 1024 x 768px čtvrtek, 21. června 12 Už nějakých 10 let se průměrné rozlišení počítačů pohybuje kolem 1024x768px. A chytré telefony kterých je čím dál víc (za rok či dva jich prý bude více jak počítačů), tak mají rozlišení pětinové. Pouhých 20% plochy obrazovky.
  • 14. 1024 x 768px 320 x 480 px 20% čtvrtek, 21. června 12 Už nějakých 10 let se průměrné rozlišení počítačů pohybuje kolem 1024x768px. A chytré telefony kterých je čím dál víc (za rok či dva jich prý bude více jak počítačů), tak mají rozlišení pětinové. Pouhých 20% plochy obrazovky. Na smartfounu tedy nebudete mít díru nikdy. Budete řešit opačný problém - moc věcí, které tam potřebujete dát.
  • 15. čtvrtek, 21. června 12 Flickr znáte? Služba pro sdílení fotek.
  • 16. čtvrtek, 21. června 12 Jen v menu se skrývá přes 60 položek. Jak tohle sakra dostali do mobilu? Udělali jednoduchou věc. Vyškrtali všechno co není potřeba a nechali jen to, co skutečně potřeba je. Jádro aplikace, to co lidé nejvíce používají, za čím tam chodí.
  • 17. čtvrtek, 21. června 12 Jen v menu se skrývá přes 60 položek. Jak tohle sakra dostali do mobilu? Udělali jednoduchou věc. Vyškrtali všechno co není potřeba a nechali jen to, co skutečně potřeba je. Jádro aplikace, to co lidé nejvíce používají, za čím tam chodí.
  • 18. čtvrtek, 21. června 12 Jen v menu se skrývá přes 60 položek. Jak tohle sakra dostali do mobilu? Udělali jednoduchou věc. Vyškrtali všechno co není potřeba a nechali jen to, co skutečně potřeba je. Jádro aplikace, to co lidé nejvíce používají, za čím tam chodí.
  • 19. čtvrtek, 21. června 12 Jen v menu se skrývá přes 60 položek. Jak tohle sakra dostali do mobilu? Udělali jednoduchou věc. Vyškrtali všechno co není potřeba a nechali jen to, co skutečně potřeba je. Jádro aplikace, to co lidé nejvíce používají, za čím tam chodí.
  • 20. čtvrtek, 21. června 12 Jen v menu se skrývá přes 60 položek. Jak tohle sakra dostali do mobilu? Udělali jednoduchou věc. Vyškrtali všechno co není potřeba a nechali jen to, co skutečně potřeba je. Jádro aplikace, to co lidé nejvíce používají, za čím tam chodí.
  • 21. čtvrtek, 21. června 12 Jen v menu se skrývá přes 60 položek. Jak tohle sakra dostali do mobilu? Udělali jednoduchou věc. Vyškrtali všechno co není potřeba a nechali jen to, co skutečně potřeba je. Jádro aplikace, to co lidé nejvíce používají, za čím tam chodí.
  • 22. čtvrtek, 21. června 12 Jen v menu se skrývá přes 60 položek. Jak tohle sakra dostali do mobilu? Udělali jednoduchou věc. Vyškrtali všechno co není potřeba a nechali jen to, co skutečně potřeba je. Jádro aplikace, to co lidé nejvíce používají, za čím tam chodí.
  • 23. čtvrtek, 21. června 12 Mají tam těch položek 5.
  • 24. čtvrtek, 21. června 12 Malý prostor je úžasné omezení pro každého designera, protože malý prostor vás donutí zjednodušovat, donutí vás skutečně zapřemýšlet nad tím co prioritu má a co prioritu nemá. Sednout si, přemýšlet, škrtat, zjednodušovat.
  • 26. čtvrtek, 21. června 12 Antoine de Saint-Exupery řekl jednu geniální větu: "Dokonalosti je dosaženo, nikoliv když již nelze nic víc přidat, ale když není již možné nic odebrat."
  • 27. Vydělává peníze čtvrtek, 21. června 12 Ono to má ještě jednu souvislost a to souvislost s byznysem. Vy se díky tomu, že se při návrhu soustředíte na to podstatné, soustředíte tedy na to co, vám vlastně vydělává peníze. Ta služba, kterou nabízí, produkt, který prodáváte, to je to co lidí vlastně u vás chtějí. A můžete v klidu zapomenout na balast kolem. Nevyhazujte peníze za něco, co nikdo moc neocení.
  • 28. čtvrtek, 21. června 12 Postupme ještě o krok dál. Zpátky na web. Ukažme si příklad, jak vám návrh pro mobil pomůže s velkým webem.
  • 29. čtvrtek, 21. června 12 Statefarm je americká pojišťovna.
  • 30. čtvrtek, 21. června 12 Ještě v loňském roce vypadal jejich web nějak takto. Velký banner s bílým nečitelným textem, usměvavý pán, hromada divných obdélníků, v menu mraky věcí.
  • 31. čtvrtek, 21. června 12 Pak udělali mobilní verzi. Na prvním místě - založení pojištění. Jádro jejich bysnysu. V druhém sledu nalezení agenta a hlášení škod.Pomoc v nouzi a pak nabídka dalších pojištění. 5 věcí! Tj. nejčastější věci, které u nich uživatelé řeší.
  • 32. čtvrtek, 21. června 12 A tuhle zkušenost oni aplikovali i na web. Na první místě sjednání po jištění, hned vedle kontakt a hlášení pojistné události. Pod tím nabídka dalších pojištění. Stejný pattern
  • 33. čtvrtek, 21. června 12 Spíše perlička. Webový designer Jeffrey Zeldman zašel při návrhu svého nového webu ještě o krok dál. Vlastně zůstal v kroku prvním. Jeffrey Zeldman - A List Apart - Designing with Web Standards
  • 34. čtvrtek, 21. června 12 Udělal svůj web Mobile Only. Taky způsob :)
  • 37. čtvrtek, 21. června 12 Druhou věcí, krom malé obrazovky, se kterou se musíte na mobilu vypořádat je, že jsou to zařízení pomalá. Mají pomalejší připojení k Internetu, mají pomalejší vykreslování stránek, pomalejší vykreslování Javascriptu atd. Tudíž, aby byla vaše webová stránka na mobilu použitelná, tak musí být v prvé řadě rychlá. Stránka se musí rychle načíst, musí se rychle vykreslit, všechny prvky, které na ní jsou musí na uživatele reagovat bleskově.
  • 38. Miller, R. B. (1968). Response time in man-computer conversational transactions. Proc. AFIPS Fall Joint Computer Conference Vol. 33, 267-277 čtvrtek, 21. června 12 Protože použitelnost velmi souvisí s rychlostí, což už je známo přes 40 let. R.B.Miller - 1968 - Response time in man-computer conversational transactions
  • 39. Speed is best feature http://pacepirate.tumblr.com/post/23988387164 čtvrtek, 21. června 12 Dá se říct, že rychlost je ta nejlepší funkce, kterou svým uživatelům můžete dopřát. A jakmile dokážete optimalizovat vaší stránku na mobilním zařízení, představte si, jak úžasně rychlá bude na uživatelově notebooku či stolním počítači.
  • 40. http://www.flickr.com/photos/72296542@N00/382441387/ čtvrtek, 21. června 12 Vaši uživatelé budou jednoduše nadšeni. A o to tu jde, ne?
  • 41. “Mobile experiences fill the gaps while we wait. Nobody wants to wait while we wait.” - Mike Krieger, Co-founder Instagram čtvrtek, 21. června 12 Lidé velmi často používají mobilní zařízení, když čekají a nikdo nechce čekat, když čeká.
  • 43. 100ms zpoždění při vypisování výsledků vygeneruje ročně 1% ztrátu. Což je zhruba 200 milionů dolarů ročně. 400ms zpoždění výsledků sníží o 5-9% celkový provoz na stránkách. 500ms zpoždění snižuje provoz ve vyhledávači o 20%. 1s zpoždění výsledků snižuje příjem o 4%. 10% nejrychlejších uživatelů zůstává na stránkách o 50% déle než 10% uživatelů pomalých. Sources: slideshare.net/stubbornella/designing-fast-websites-presentation & slideshare.net/markstanton/speed-matters čtvrtek, 21. června 12 Studie za studií potvrzují, že nedostatečná rychlost vašeho webu vás může připravit o slušné příjmy. Amazon - 100ms zpoždění při vypisování výsledků vygeneruje ročně 1% ztrátu. Což je zhruba 200 milionů dolarů ročně. Yahoo - 400ms zpoždění výsledků sníží o 5-9% celkový provoz na stránkách Google - 500ms zpoždění snižuje provoz ve vyhledávači o 20%. Bing - 1s zpoždění výsledků snižuje příjem o 4% AOL 10% nejrychlejších uživatelů zůstává na stránkách o 50% déle než 10% uživatelů pomalých.
  • 44. http://www.flickr.com/photos/92921037@N00/5532840143/ čtvrtek, 21. června 12 Když navrhujete weby pro mobilní zařízení, tak se musíte vyrovnat se dvěma velkými problémy: malá obrazovka a pomalé načítání stránek. Jsou to dva problémy a zároveň skvělé příležitosti, jak vytvořit příjemnou a svižnou prezentaci či službu.
  • 45. čtvrtek, 21. června 12 Když navrhujete weby pro mobilní zařízení, tak se musíte vyrovnat se dvěma velkými problémy: malá obrazovka a pomalé načítání stránek. Jsou to dva problémy a zároveň skvělé příležitosti, jak vytvořit příjemnou a svižnou prezentaci či službu.
  • 47. “Yes, I am...” čtvrtek, 21. června 12 Návrh pro mobilní zařízení dokáže zlepšit uživatelskou zkušenost i na velkém webu. Máte méně funkcí, které jsou ale zatraceně rychlé a vymazlené.
  • 48. http://www.flickr.com/photos/94588149@N00/4758676577/ čtvrtek, 21. června 12 Návrh pro mobilní zařízení vám dokáže ušetřit či dokonce vydělat i nějaké peníze. Zaměříte se na to, co vám peníze vydělává a kde jenom utrácíte.
  • 49. http://www.flickr.com/photos/44083360@N00/6157683097/ čtvrtek, 21. června 12 Občas jsou omezení super. Máte prostě méně věcí, o které se musíte starat. A naopak je může vyladit k dokonalosti.
  • 50. http://www.flickr.com/photos/95572727@N00/4317572931/ čtvrtek, 21. června 12 Až zítra ráno přijdete do práce můžete zkusit následující:
  • 51. 1 Představte si svůj web na mobilu čtvrtek, 21. června 12 Koukněte se na váš web a představte si ho na mobilu.
  • 52. 2 Začněte řezat čtvrtek, 21. června 12 Začněte ho řezat.
  • 53. 3 Optimalizujte čtvrtek, 21. června 12 Začněte optimalizovat jeho kód.
  • 55. @soundake http://soundake.cz/ http://symbio.cz/ čtvrtek, 21. června 12