You are on page 1of 3

RAyson@nerdattack.com.

my
what is mobile design?
creation of user software. mobile phone. private device - public context.
expect distractions. you dont want to much time on apps. few walled gardens.
developers are blocked to phone capabilities
hp 2000 - only voice and sms and bitmap
hp2010 - games gps presence
for human beings, research, test it, get it in a device quickly.
pixel problem. different screen different resolution
simplified design... minimal image size flatten color... simplified resource. c/o only 2
images.
use composites.. pengabungan image. tips:
human beings, research, test it, get it in a device quickly. pixe size will vary, mobile
is different than PC.

exercize:
context: im bored and lonely... going to surf the net
problem: whats the newest internet meme

How do i monetize my app?


graphic+codes+coffee = app
test! u are not a user. get feedback from focus group
have a test script ready.. test all buttons.
if youre using photoshop always use 'safe as web'
try www.smush.it
remember to composite images.
can u port it to another device? should use less time.
use png files as much as possible
UX=user experience
the best app= doesnt need user guide. very natural. everybody an understan at first
glance
do you want to support potrait mode or landscape mode

screen: capacitive and resistive


capacitive screen: have a large hit area---60 pixels
screen transistion.. dont use WRT (web run time)cause its slow

common oversight
-Readability -> adjust font and line hight
-Navigation -> info must be clear. must know what screen they are in. hotspot (color
ketika pemilihan). must have reaction to pemilihan (visual feedback). c/o contacts:
kasih foto jadi terlihat rich and unique. add a loader icon so the user know something
is being process
-pagination: show all pages. user must now how many pages there are. or use scroll.
navogator must be clear. c/o use "load more..."
or 1of20. slide to right. click to right. pastikan kalo on first page panah ke kiri di dim
warnanya
- buttons: must look like a button. big juicy button. great to tap. try dont have more
than 3 buttons to tap on one line. try to make context, info, clickable
-inputs : dont use tiny fields, must have visual feedback on touch events. coba kayak
iphone. nyalain setting kaya geser switch (like turning on wifi enabled and disabled)
- search: coba pakai magnifying icon. put dim text "enter search here" dan tombol
go. kalo emang search sesuatu di layar itu jangan pindah layar. contoh contacts
dibawahnya ada daftar contacts.. liek facebook
-call to action: ok and no option should look very different. ut a color green and red.
use cnfirm and ignore. dont use words like sign in or sign up. very ambigous
-screen: try to change the title name so user know what it is. contoh fb: "friends" di
atas biar user tau
-loading indiators: how do users kno what is happening?? try to have an escape
button incase something goes wrong. so the user can quit the app, change menu, go
back, etc

pay a lot of time to designyour UI/UX


beautifull design sells better!
simple app but beautifull design

user segment? who?


aim to a segment group
-tech geek: like gadgets, buys newest gadget, big income, checks engadget.com 10
times a day
-try to use personas

excercize:
who? internet enthusiast
where? everywhere
lifestyle? moves a lot, surf on the go
motivates? get the newest info?
profession? student, young executive,
his relation to his mobile? its his wife
how much time? frequently
what does she he look like? like me

try to write a storyboard to illustrate the desired and realistic use cases
try to draw a navigation map

paper prototyping
lo fidelity and high fidelity (use photoshop)
there is a prototyping tool called flowella
dipakaiuntuk lihat flow. hanyapake adobe photoshop dll. enak untuk ngetest menu
flow
supports flash and wrt. will suport QT soon

MOBILE DESIGN
designers are not decoraters. good design is problem solving
elements:
-context: who rurusers. what do you know about them. whats happening. when will
users use the content. where will they use them? whune?
when? how long will they use the app? whywill they use the app. how are they using
the device? potrait or landscape?
-message
-look and feel dark, bright, fun, fungky, professional, modern. try to pick three
keyword to start your design.
-layout
-colour: obstacle: mobile screen
-typography
-graphics: makes a look and feel iconography. use icons for buttons
www.smashing,agazine.com/tag/icons free resource icons! greaat!
u dont have to be a graphic designer to know, understand the basic of a good design.
design for users not to impress peers
whitespace is important
buttons should not be so tght on text. jangan gede bgt tulisan ama kotaknha. kasi
ruang nafas
text jangan deket ujung layar
dont use bold
use shadow for text labels

You might also like