Weitere ähnliche Inhalte Ähnlich wie Mobile First | Hogyan tervezzünk mobilra? Ähnlich wie Mobile First | Hogyan tervezzünk mobilra? (20) Mobile First | Hogyan tervezzünk mobilra?2. Főbb pontok
• Miért Mobil?
• Tervezzünk Mobilra!
• Technológiák
• Lehetőségek
• Tervezési irányelvek
6. Valami megváltozott
• Mobile Web Experience
• Érintőképernyő, 3G
• App Store & Android Market etc.
• Egyszerűbb fejlesztés
• Széleskörű publikáció
7. Mobil növekedés
• 2012 előznek az okostelefonok
• Több internet képes mobil mint
bármilyen más eszköz
• Növekednek a mobil elérések
8. Mobil növekedés
• Mail (web: -6% mobil: +36%)
• Paypal: 10 millió dollár forgalom
mobilról
• eBay: 2010: 2 milliárd dolláros forgalom
16. Mobile First
• Inkább lehetőség mint probléma
• Felesleges elemek megtalálása
• Struktúrális átalakítás
17. Mobile First
• Cél és funkciók meghatározása
• Google Analytics
• Mobilról hogyan használják az
oldalunkat?
24. London Tube
• Eltér a felhasználás helye
• Cél megértése, funkciók tisztázása
• Telefon lehetőségeinek kihasználása
26. Natív?
Webapp?
Reszponzív?
30. Mobile Apps
• Szinte bármelyik rendszeren elfutnak
• Olcsóbb a fejlesztés
• Korlátozott hozzáférés a telefonhoz
• Jobban támaszkodik a netes kapcsolatra
44. Natural User Interface
• CLI - GUI - NUI
• Direkt, intuitív
• Nem igényel semmilyen egyéb eszközt
(post-WIMP)
• Navigációs akciók
46. NFC
• Telefon - Telefon
között
• Telefon - Tag
• Fizetési rendszerek
• Wifi regisztráció,
Social Media
56. Galaxy
iPhone 4
S II
3,5 inch
4,21 inch
http://dcurt.is/2011/10/03/3-point-5-inches/
60. Navigációs Interakciók
• Scroll
• Gyorsabb scroll
• Navigációs Pontok
• Fejléc - Lábléc
http://www.alistapart.com/d/organizing-mobile/4-15.png
63. Input formok
• Integrált felhasználóbarát elemek
• Figyeljünk a méretek betartására
(7-9mm)
• Adjunk meg alap értékeket
• Figyeljünk a nem érintőképernyős
eszközökre is
65. Input formok
• Új standardok
• HTML5 (url, email, number)
• autocapitalize, autocorrect
• Input maszkok
67. Teljesítmény
• Spriteok egy fájlban
• CSS és Js fájlok tömörítése
• Felesleges kódrészletek eltávolítása
• HTML5 Application Cache
• CSS3 technikák