TipiUX#4: Od pomysłu do wdrożenia - proces projektowania interfejsów aplikacji na platformie iOS
0 likes293 views
Mamy pomysł na aplikację na iPhone i co dalej? Skąd brać inspiracje? Na co najbardziej zwracać uwagę podczas projektowania? Z jakich narzędzi korzystać by usprawnićsobie pracę? Prezentacja ze spotkania TipiUX#4 które odbyło się w strefie startupów PPNT Gdynia.
![[DPTO] Michał Pogorzelski - Testy jednostkowe – narzędzie, które pozwala prac...](https://cdn.slidesharecdn.com/ss_thumbnails/testyjednostkowepogorzelski-180321102844-thumbnail.jpg?width=560&fit=bounds)
More Related Content
Similar to TipiUX#4: Od pomysłu do wdrożenia - proces projektowania interfejsów aplikacji na platformie iOS (20)
TipiUX#4: Od pomysłu do wdrożenia - proces projektowania interfejsów aplikacji na platformie iOS
- 1. P RO C E S P RO J E K TO WA N I A I N T E R F E J S Ó W A P L I K AC J I N A P L AT F O R M I E I O S W P I G U Ł C E O D P O M Y S Ł U D O W D ROŻ E N I A Maciej Kołek iOS Developer
- 2. • Kogo potrzebujemy do stworzenia naszej aplikacji? • Etapy tworzenia interfejsu • Na co zwracać uwagę przy tworzeniu interfejsów na platformę iOS? K R Ó T K A A G E N D A
- 3. K O G O P O T R Z E B U J E M Y D O S T W O R Z E N I A A P L I K A C J I ?
- 4. K O G O P O T R Z E B U J E M Y D O S T W O R Z E N I A A P L I K A C J I ? Pomysłodawca
- 5. K O G O P O T R Z E B U J E M Y D O S T W O R Z E N I A A P L I K A C J I ? Pomysłodawca Grafik
- 6. K O G O P O T R Z E B U J E M Y D O S T W O R Z E N I A A P L I K A C J I ? Pomysłodawca Grafik Programista
- 7. K O G O P O T R Z E B U J E M Y D O S T W O R Z E N I A A P L I K A C J I ? Pomysłodawca Grafik Programista Programista API Tester Konsultant
- 8. E TA P P O M Y S Ł O D AW C Y
- 9. W PA D L I Ś M Y N A P O M Y S Ł S T W O R Z E N I A U N I K AT O W E J A P L I K A C J I M O B I L N E J …
- 10. W PA D L I Ś M Y N A P O M Y S Ł S T W O R Z E N I A U N I K AT O W E J A P L I K A C J I M O B I L N E J …
- 11. S N A P P Y
- 12. S K Ą D B R A Ć P O M Y S Ł Y N A I N T E R F E J S ? https://ios.uplabs.com
- 13. G D Z I E C Z Y TA Ć O D O B RY M U X ? http://uxplanet.org
- 14. O D C Z E G O Z A C Z Ą Ć ?
- 15. O D C Z E G O Z A C Z Ą Ć ?
- 16. C O D A L E J ?
- 17. C O D A L E J ?
- 18. Z A P O M O C Ą A P L I K A C J I P O P S P R AW B Y T W O J E B A Z G R O Ł Y O Ż Y Ł Y
- 19. Z A P O M O C Ą A P L I K A C J I P O P S P R AW B Y T W O J E B A Z G R O Ł Y O Ż Y Ł Y
- 20. Z A P O M O C Ą A P L I K A C J I P O P S P R AW B Y T W O J E B A Z G R O Ł Y O Ż Y Ł Y
- 21. N I E U M I E M RY S O WA Ć , C O T E R A Z ?
- 22. R A T U N E K D L A O S Ó B U Z D O L N I O N Y C H S P R AW B Y T W O J E K O M P U T E R O W E B A Z G R O Ł Y O Ż Y Ł Y
- 23. R A T U N E K D L A O S Ó B U Z D O L N I O N Y C H S P R AW B Y T W O J E K O M P U T E R O W E B A Z G R O Ł Y O Ż Y Ł Y
- 24. R A T U N E K D L A O S Ó B U Z D O L N I O N Y C H S P R AW B Y T W O J E K O M P U T E R O W E B A Z G R O Ł Y O Ż Y Ł Y
- 25. R A T U N E K D L A O S Ó B U Z D O L N I O N Y C H S P R AW B Y T W O J E K O M P U T E R O W E B A Z G R O Ł Y O Ż Y Ł Y
- 26. E TA P G R A F I K A
- 27. P H O T O S H O P V S S K E T C H http://www.webdesignerdepot.com/2015/03/infographic-sketch-vs-photoshop/
- 28. P L E A S E , J U S T U S E S K E T C H . To jedyne narzędzie które coś kosztuje: 99$ po 30 dniach triala
- 29. G R A F I K N I E P Ł A K A Ł J A K P R O J E K T O WA Ł J A K P R A C O WA Ć Z K L I E N T E M N A D P R O J E K TA M I G R A F I C Z N Y M I ?
- 30. R O Z W I Ą Z A N I E : I N V I S I O N A P P
- 31. R O Z W I Ą Z A N I E : I N V I S I O N A P P
- 32. R O Z W I Ą Z A N I E : I N V I S I O N A P P
- 33. R O Z W I Ą Z A N I E : I N V I S I O N A P P
- 34. T E S T O WA N I E M A K I E T Z U Ż Y C I E M I N V I S I O N A P P
- 35. T E S T O WA N I E M A K I E T Z U Ż Y C I E M I N V I S I O N A P P
- 36. P R O J E K T G O T O W Y. C O D A L E J ?
- 37. P R O B L E M ? 1 p x ≠ 1 p t
- 38. R O Z W I Ą Z A N I E : http://zeplin.io
- 40. E k s p o r t b e z p o ś re d n i o z e S k e t c h a
- 49. E TA P P R O G R A M I S T Y
- 50. J A K P R O G R A M I S TA P R Z Y G O T O W U J E I N T E R F E J S A P L I K A C J I ?
- 52. Nawigacja
- 53. C O P R O G R A M I S TA M U S I W I E D Z I E Ć Z A N I M U S I Ą D Z I E D O P R A C Y ? • Na jakie urządzenia piszemy aplikacje? • Jaki jest główny system operacyjny który będziemy wspierać w aplikacji? • Jak wygląda podstawowy flow nawigacji w aplikacji? DLA CAŁEGO PROJEKTU:
- 54. C O P R O G R A M I S TA M U S I W I E D Z I E Ć Z A N I M U S I Ą D Z I E D O P R A C Y ? • Która części interfejsu będą dynamiczne, a które statyczne? • Jak wygląda nawigacja w tym ekranie? • Skąd użytkownik może wejść do tego ekranu? • Jak majązachowywać się wszystkie elementy tego interfejsu? (przyciski, zmiany stanów, alerty) • Jak aplikacja ma wyświetlać się na mniejszych i większych ekranach? • Jakie są odległości i wymiary wszystkich elementów ekranu? • Czy mamy jużwszystkie grafiki w odpowiednich rozmiarach (x1,x2,x3)? PER EKRAN INTERFEJSU:
- 55. P O C O T Y L E P Y TA Ń ?
- 56. K A Ż D Y E L E M E N T I N T E R F E J S U M A S W O J E Z A L E Ż N O Ś C I : O D L E G Ł O Ś C I R E L AT Y W N E O D I N N Y C H E L E M E N T Ó W I N T E R F E J S U + S W O J Ą W I E L K O Ś Ć ( S TA Ł Ą L U B D Y N A M I C Z N Ą )
- 57. D L AT E G O T E N P R O J E K T…
- 58. W X C O D E W Y G L Ą D A TA K :
- 59. Już na podglądzie możemy zobaczyć, że na mniejszym iPhone musimy zmniejszać pierwszy obrazek.
- 60. O C Z Y M PA M I Ę TA Ć P R Z Y P R O J E K T O WA N I U A P L I K A C J I ? • Wsparcie dla mniejszych urządzeń - nie każdy ma iPhone 6 • Jak elementy interfejsu reagują na interakcje? (stany przycisków) • Klawiatura zasłania większączęść ekranu • Design ikony ma znaczenie • Splash screen jest częścią interfejsu, nie statyczną grafiką • Wszystkie rozmiary elementów interfejsu powinny być parzyste
- 61. P Y TA N I A ? Maciej Kołek iOS Developer @ferusinfohello@ferus.info Jeśli tworzysz coś mobilnego i potrzebujesz porady lub szukasz programisty iOS do projektu: Zapraszam do kontaktu!
- 62. A jeśli szukasz fotografa na dowolną okazję: http://fb.me/maciejkolekcom