Äèçàéí è âåðñòêà
ìîáèëüíîãî ïðèëîæåíèÿ
1

Êàê ïðîèñõîäèò ïðîöåññ
ðàçðàáîòêè äèçàéíà ÌÏ

2
Ìû
ðàçáåðåì

Îñîáåííîñòè
äèçàéíà ÌÏ

3

Ïîäãîòîâêà ê âåðñòêå.
Íàðåçêà, ...
1

Êàê ïðîõîäèò
ïðîöåññ
ðàçðàáîòêè
äèçàéíà ÌÏ
Èòàê!
Ïðîéäÿ ýòàï ïîäãîòîâêè
è ýòàï ïðîåêòèðîâàíèÿ,
ìû èìååì:
ïðîàíàëèçèðîâàííîå ÒÇ,
ñòðóêòóðó ÌÏ,
óòâåðæäåííûé ïðîòîòèï
ñ...
Àíàëèç
Âêëþ÷àÿñü â ðàáîòó, äèçàéíåð åùå ðàç
ïðîâîäèò
Èçó÷åíèå ÒÇ è áðèôà.
Ðàññìîòðåíèå ôóíêöèîíàëà ïðèëîæåíèÿ.
Òåñòèðîâàíè...
Àíàëèç
îïðåäåëåíèå òèïà ïðèëîæåíèÿ
ïîèñê è àíàëèç àíàëîãîâ
âûÿâëåíèå ñèëüíûõ è ñëàáûõ ñòîðîí
âûâîä
Îïðåäåëåíèå
êîíöåïöèè
ðàçðàáîòêà 2-3 âàðèàíòîâ
äèçàéí-êîíöåïöèé
àíàëèç ðàçðàáîòàííûõ êîíöåïöèé
(ðàáîòà âíóòðè êîìàíäû)
âûÿ...
Óòâåðæäåíèå
êîíöåïöèè
ïðåäñòàâëåíèå äèçàéí-êîíöåïöèè
çàêàç÷èêó
ïðàâêè
óòâåðæäåíèå äèçàéí-êîíöåïöèè
Óðà! Íàêîíåö! Òâîðèì!
îòðèñîâêà ýêðàíîâ
ñ ïðèìåíåíèåì óòâåðæäåííîé êîíöåïöèè
ñîçäàíèå ïðîòîòèïà
òåñòèðîâàíèå
Èòîã
ïðåçåíòàöèÿ ïðîòîòèïà çàêàç÷èêó
ïðàâêè
!óòâåðæäåíèå ïðîåêòà!
2

Îñîáåííîñòè
äèçàéíà
ÌÏ
Îñíîâíûå ïðèíöèïû

×èñòîòà
Ïðîñòîòà
Ôóíêöèîíàëüíîñòü
Óäîáîïîëüçîâàíèå
Ïàëåö = êóðñîð
!
ðàçìåð èìååò çíà÷åíèå
êàæäûé ïèñêåëü íà âåñ çîëîòà
ó÷èòûâàåì ôîðìàò ýêðàíà
ìîáèëüíîãî òåëåôîíà,
ìûøëåíèå ïîëüçîâàòåëåé
ãàéäëàéíû
ðàçìåðû è ðàñïîëîæåíèÿ
ñåòêà
ïðîäóìûâàòü
õàðàêòåðíûå ôóíêöèè,
ïåðåõîäû è ýëåìåíòû ÌÏ
äèçàéí,
êîòîðûé õî÷åòñÿ ïîòðîãàòü
3

Íàðåçêà,
êàê ñàìûé íóäíûé,
íî êðàéíå âàæíûé
ýòàï ðàáîòû
äèçàéíåðà
Çà÷åì íóæíà íàðåçêà?

Ïî÷åìó åå äîëæåí äåëàòü äèçàéíåð?
Ñ ÷åãî íà÷àòü?
1. Ðàçäåëèì ýêðàíû íà êëàñòåðû ïî ïîäîáíûì òèïàì
2. Äëÿ êàæäîãî òèïà ýêðàíà ñîçäàåì ëèñò.
Íà ýñêèçå îòìå÷àåì ðàçìåðû è âûíîñèì âñå çíà÷åíèÿ
øðèôòà, öâåòà, ðàñïîëîæåíèÿ è ò...
3. Êàæäûé ýëåìåíò ñîõðàíÿåòñÿ â íåñêîëüêèõ çíà÷åíèÿõ:
íàïðèìåð, äëÿ ðåòèíû è íåðåòèíû ïîä ñîáñòâåííûì èìåíåì.

rateview_ic...
4.  ïåðâóþ î÷åðåäü îòäåëüíî ìîæíî
íàðåçàòü îñíîâíûå ýëåìåíòû
/Tab Bar, Title Bar/
5. Äëÿ êàæäîãî ýêðàíà ñëåäóåò ñîçäàòü îòäåëüíóþ ïàïêó.

6.1no_connect
no_connect_pop_up
no_connect

no_connect@2x

no_conn...
6. Íåëüçÿ çàáûâàòü îïèñûâàòü âñå äåéñòâèÿ,
ó÷èòûâàòü âñå ñèòóàöèè.
Ëþáûå êîììåíòàðèè, êîòîðûå
ìîãóò îáëåã÷èòü ðàáîòó ïðîãð...
!!!
äèçàéíåð

ïðîãðàììèñò

friends forever
ïðèñòàëüíîå âíèìàíèå íàäî óäåëÿòü
èíòåãðàöèè äèçàéíà
ò.ê. íå ìàêåò äèçàéíåðà âèäèò
ïîëüçîâàòåëü ó ñåáÿ íà ýêðàíå,
à êîíå÷í...
ïðèñòàëüíîå âíèìàíèå íàäî óäåëÿòü
èíòåãðàöèè äèçàéíà
ò.ê. íå ìàêåò äèçàéíåðà âèäèò
ïîëüçîâàòåëü ó ñåáÿ íà ýêðàíå,
à êîíå÷í...
Ïî âñåì äîïîëíèòåëüíûì âîïðîñàì

Kacàòêèíà Èðèíà
vk.com/kasatkinaii
kasatkina18@gmail.com
Дизайн и верстка мобильного приложения
Upcoming SlideShare
Loading in …5
×

Дизайн и верстка мобильного приложения

211 views

Published on

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
211
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
5
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Дизайн и верстка мобильного приложения

  1. 1. Äèçàéí è âåðñòêà ìîáèëüíîãî ïðèëîæåíèÿ
  2. 2. 1 Êàê ïðîèñõîäèò ïðîöåññ ðàçðàáîòêè äèçàéíà ÌÏ 2 Ìû ðàçáåðåì Îñîáåííîñòè äèçàéíà ÌÏ 3 Ïîäãîòîâêà ê âåðñòêå. Íàðåçêà, êàê ñàìûé íóäíûé, íî êðàéíå âàæíûé ýòàï ðàáîòû äèçàéíåðà
  3. 3. 1 Êàê ïðîõîäèò ïðîöåññ ðàçðàáîòêè äèçàéíà ÌÏ
  4. 4. Èòàê! Ïðîéäÿ ýòàï ïîäãîòîâêè è ýòàï ïðîåêòèðîâàíèÿ, ìû èìååì: ïðîàíàëèçèðîâàííîå ÒÇ, ñòðóêòóðó ÌÏ, óòâåðæäåííûé ïðîòîòèï ñ ïîëíîñòüþ ïðîäóìàííûì ôóíêöèîíàëîì è êàðòîé ýêðàíîâ
  5. 5. Àíàëèç Âêëþ÷àÿñü â ðàáîòó, äèçàéíåð åùå ðàç ïðîâîäèò Èçó÷åíèå ÒÇ è áðèôà. Ðàññìîòðåíèå ôóíêöèîíàëà ïðèëîæåíèÿ. Òåñòèðîâàíèå ïðîòîòèïà. Òåì ñàìûì âûÿâëÿÿ àñïåêòû, êîòîðûå íåîáõîäèìî ó÷èòûâàòü ïðè ïðîöåññå äèçàéíà.
  6. 6. Àíàëèç îïðåäåëåíèå òèïà ïðèëîæåíèÿ ïîèñê è àíàëèç àíàëîãîâ âûÿâëåíèå ñèëüíûõ è ñëàáûõ ñòîðîí âûâîä
  7. 7. Îïðåäåëåíèå êîíöåïöèè ðàçðàáîòêà 2-3 âàðèàíòîâ äèçàéí-êîíöåïöèé àíàëèç ðàçðàáîòàííûõ êîíöåïöèé (ðàáîòà âíóòðè êîìàíäû) âûÿâëåíèå åäèíîé íàèëó÷øåé
  8. 8. Óòâåðæäåíèå êîíöåïöèè ïðåäñòàâëåíèå äèçàéí-êîíöåïöèè çàêàç÷èêó ïðàâêè óòâåðæäåíèå äèçàéí-êîíöåïöèè
  9. 9. Óðà! Íàêîíåö! Òâîðèì! îòðèñîâêà ýêðàíîâ ñ ïðèìåíåíèåì óòâåðæäåííîé êîíöåïöèè ñîçäàíèå ïðîòîòèïà òåñòèðîâàíèå
  10. 10. Èòîã ïðåçåíòàöèÿ ïðîòîòèïà çàêàç÷èêó ïðàâêè !óòâåðæäåíèå ïðîåêòà!
  11. 11. 2 Îñîáåííîñòè äèçàéíà ÌÏ
  12. 12. Îñíîâíûå ïðèíöèïû ×èñòîòà Ïðîñòîòà Ôóíêöèîíàëüíîñòü Óäîáîïîëüçîâàíèå
  13. 13. Ïàëåö = êóðñîð
  14. 14. ! ðàçìåð èìååò çíà÷åíèå êàæäûé ïèñêåëü íà âåñ çîëîòà
  15. 15. ó÷èòûâàåì ôîðìàò ýêðàíà ìîáèëüíîãî òåëåôîíà, ìûøëåíèå ïîëüçîâàòåëåé
  16. 16. ãàéäëàéíû ðàçìåðû è ðàñïîëîæåíèÿ ñåòêà
  17. 17. ïðîäóìûâàòü õàðàêòåðíûå ôóíêöèè, ïåðåõîäû è ýëåìåíòû ÌÏ
  18. 18. äèçàéí, êîòîðûé õî÷åòñÿ ïîòðîãàòü
  19. 19. 3 Íàðåçêà, êàê ñàìûé íóäíûé, íî êðàéíå âàæíûé ýòàï ðàáîòû äèçàéíåðà
  20. 20. Çà÷åì íóæíà íàðåçêà? Ïî÷åìó åå äîëæåí äåëàòü äèçàéíåð?
  21. 21. Ñ ÷åãî íà÷àòü? 1. Ðàçäåëèì ýêðàíû íà êëàñòåðû ïî ïîäîáíûì òèïàì
  22. 22. 2. Äëÿ êàæäîãî òèïà ýêðàíà ñîçäàåì ëèñò. Íà ýñêèçå îòìå÷àåì ðàçìåðû è âûíîñèì âñå çíà÷åíèÿ øðèôòà, öâåòà, ðàñïîëîæåíèÿ è ò.ï. Îòäåëüíî èçîáðàæàåì ðÿäîì íàðåçàííûå ýëåìåíòû äëÿ íàãëÿäíîñòè.
  23. 23. 3. Êàæäûé ýëåìåíò ñîõðàíÿåòñÿ â íåñêîëüêèõ çíà÷åíèÿõ: íàïðèìåð, äëÿ ðåòèíû è íåðåòèíû ïîä ñîáñòâåííûì èìåíåì. rateview_icon_star_blue rateview_icon_star_blue@2x list_pokypatel_bg list_pokypatel_bg@2x
  24. 24. 4.  ïåðâóþ î÷åðåäü îòäåëüíî ìîæíî íàðåçàòü îñíîâíûå ýëåìåíòû /Tab Bar, Title Bar/
  25. 25. 5. Äëÿ êàæäîãî ýêðàíà ñëåäóåò ñîçäàòü îòäåëüíóþ ïàïêó. 6.1no_connect no_connect_pop_up no_connect no_connect@2x no_connect_pop_up@2x no_connect_icon_web no_connect_icon_web@2x
  26. 26. 6. Íåëüçÿ çàáûâàòü îïèñûâàòü âñå äåéñòâèÿ, ó÷èòûâàòü âñå ñèòóàöèè. Ëþáûå êîììåíòàðèè, êîòîðûå ìîãóò îáëåã÷èòü ðàáîòó ïðîãðàììèñòà, óìåñòíû!
  27. 27. !!! äèçàéíåð ïðîãðàììèñò friends forever
  28. 28. ïðèñòàëüíîå âíèìàíèå íàäî óäåëÿòü èíòåãðàöèè äèçàéíà ò.ê. íå ìàêåò äèçàéíåðà âèäèò ïîëüçîâàòåëü ó ñåáÿ íà ýêðàíå, à êîíå÷íûé ïðîäóêò !!!!!!!!!!!!!!
  29. 29. ïðèñòàëüíîå âíèìàíèå íàäî óäåëÿòü èíòåãðàöèè äèçàéíà ò.ê. íå ìàêåò äèçàéíåðà âèäèò ïîëüçîâàòåëü ó ñåáÿ íà ýêðàíå, à êîíå÷íûé ïðîäóêò !!!!!!!!!!!!!!
  30. 30. Ïî âñåì äîïîëíèòåëüíûì âîïðîñàì Kacàòêèíà Èðèíà vk.com/kasatkinaii kasatkina18@gmail.com

×