BO CO BI TP LN ti: Thit k giao din di ng

Lp : D08CNPM1

Thnh vin nhm : 1.V Hoi Nam 2.V Xun Long 3.Hong Vn Nam 4.Phm Th Nhung

1|Page

Mc lc:
1. Gii thiu chung. ........................................................3 2. Cc loi ng dng thng gp trn thit b di ng 3 3. Chin lc thit k giao din cho cc ng dng trn thit b di ng.................................................................3 4. Cc thnh phn chnh ca thit k di ng. .............6 5. Thit k cho mn hnh di ng . ..............................16 6. Cc cng c tr gip thit k di ng .....................18 7. V d minh ha cho cc thit b di ng c th. .....19 8. nh gi tnh dng c ca giao din di ng. ....21

2|Page

1. Gii thiu chung.

Hin nay th gii ang chng kin mt s bng n nhanh chng ca cc thit b di ng.Theo d bo ca Cisco th gii s c ti hn 10 t thit b c kt ni vi mng Internet di ng vo nm 2016, vt c dn s theo d bo ca th gii thi im l 7,3 t ngi.Cc thit b di ng ang nhanh chng tr nn ph bin,hin i v tin dng hn. S pht trin mnh m ca cht lng phn cng to iu kin cho vic pht trin cc ng dng trn cc thit b di ng tr nn a dng v phong ph hn bao gii ht.Cc thit b di ng c pht trin trn cc nn tng h iu hnh khc nhau.Mi h iu hnh u xy dng cho mnh nhng kho ng dng ring.V d Google Play ca Android, AppStore ca Applevv Do tnh cht c th nn ngi dng yu cu cn phi c nhng phin bn website ring cho vic lt web,nhng thit k ng dng thn thin, n gin p mt nhng vn y chc nng trn cc thit b di ng.Chnh v th m vic nghin cu v a ra cc nguyn tc cho thit k cc thit b di ng l rt cn thit.N gip cho cc nh thit k c th c ci nhn su sc hn v thit giao din trn thit b di ng.

2. Cc loi ng dng thng gp trn thit b di ng

Cc ng dng trn cc thit b di ng ang pht trin mnh,a dng v phong ph p ng gn nh y cc nhu cu cn thit ca ngi s dng.Cc ng dng ph bin bao gm: - Website phin bn di ng - Game - Cc ng dng tin ch: Nh xem bo,d bo thi tit,chnh sa nh .vv

3. Chin lc thit k giao din cho cc ng dng trn thit b di ng.

Thit k cho mn hnh nh hn 3|Page

Khi thit k cho mn hnh thit b di ng, bn phi i vo xem xt kch thc nh hn ca mn hnh. y s l kh khn cho nhng ngi trong chng ta c s dng thit k cho mn hnh ln HD vi kh nng hin th ha 1920X1200 hoc cao hn. IPhone 4 hin nay c phn gii 640 x 960 v iPad th cao hn l 1024 x 768. Mt s in thoi nh Android v Blackberry c kch thc mn hnh 320 240. l nh hn so vi nhng g chng ta ang s dng, nhng n rt quan trng lu khi thit k trang web di ng ca bn. S kt ni cn ngho nn Mt vi nm tr li trc khi Internet bng thng rng c sn trong tt c cc qun c ph gc, v thit k web xem xt cc kt ni ti ngi s dng gn hn mt cht khi ti u ha hnh nh v video cho thi gian ti nhanh hn. Bn s cn phi lm nh vy khi thit k cho trang web di ng ca bn. Cc nh cung cp dch v lin tc tung ra cc dch v c tc nhanh hn theo thi gian, nhng vn cn chp v ch tt nht trong mt s khu vc. Cng vi mt s ngi s dng, khng c k hoch gii hn d liu, tr tin ti d liu. V vy, cc nh pht trin, phi suy ngh li v nhng ngy u ca modem. Bn cn gim m, v loi b cc th khng cn thit. Gi hnh nh nh, v nn cho nh hn trong mi ln ti v. Xem xt mt in thoi di ng thn thin :Cu trc trang Ct Khi ti trang trn in thoi n thng c thu nh bng tt c cc cch c th hin th tt c ln mn hnh. Mn hnh ca hu ht tt c cc in thoi qu nh v th trang ny khng th c c cho n khi n c thu nh. iu ny khng phi l l tng bi v n to ra nhiu bc hn cho ngi s dng trong khi c ni dung ca trang. Thng thng h s phi di chuyn c hai chiu dc v ngang trong khi c. Thay v c gng thc hin mt ct b tr ph hp trong mt mn hnh in thoi di ng.Ngi dng s vn c kh nng phi di chuyn, nhng n s ch l theo chiu dc. n gin ha v Ti u ha ni dung ca bn Xem xt vic loi b cc lin kt b sung v ni dung m khng phi l trong khu vc ni dung chnh. Cc sn phm thng thy cc bn hoc 4|Page

footer ca cc trang web truyn thng thng c th c loi b tp trung sp xp hp l v n gin. Bng cch loi b nhng ni dung ny, bn cng lm gim kch thc trang v thi gian ti, l mt kha cnh quan trng ca thit k trang di ng. Gim Navigation v User Input Nhp liu ngi dng c th gp kh khn trn mt s in thoi. N khng nhanh nh mt bn phm truyn thng, v ngi dng c kh nng gy ra nhng sai lm. Chng ta c th lm cho mt vi iu chnh gim s lng u vo cn thit t ngi s dng. V d, thng tin c th c ko t ti khon hin c ca mt ngi dng trong qu trnh thanh ton. Danh mc c th c gim n mt trnh n th xung.Chng ti cng c th tn dng li th ca mt in thoi xy dng trong cc chc nng: Trnh kch c tuyt i Khi thit k cho mn hnh nh hn trnh xc nh kch thc im nh tuyt i. V d nu bn xc nh c chiu rng 200px, c th l phn ln cc mn hnh trn mt s in thoi.Hy th s dng cc kch thc tng i nh ems v t l phn trm, do kch thc s t ng iu chnh. Trnh cun Theo ti bn ch n gin l khng th trnh tt c di chuyn trong hu ht trng hp, vi kch thc mn hnh nh hn cc thit b di ng, nhng bn c th thc hin mt s iu chnh gim thiu cc di chuyn. To ra mt b tr ct 1 nh cp trn tip tc di chuyn theo chiu dc l l tng. Gim s lng hnh nh v ni dung trn trang l mt gi tt. Ngoi ra xem xt thm ni dung trong tiu , chng hn nh logo v nh hng, chng c th y ni dung xung trang gy di chuyn khng cn thit. Thit k cho mn hnh cm ng Mn hnh cm ng trn in thoi thng minh gip ci thin tri nghim ngi dng, tr khi ni n khai thc cc nt bm rt nh v cc lin kt vn bn. Ngn tay thng l qu ln xc nh chnh xc mt lin kt 5|Page

vn bn nh. i vi cc lin kt v nh hng quan trng xem xt vic s dng cc nt ln ko di chiu rng ca mn hnh.

Chn Font cho ni dung ca bn

Vi kh nng nhng cc font vo trang web, cn thit la chn mt phng ch c th c c trn mt mn hnh nh. Trnh kch bn v phng ch vit tay, ngay c i vi tiu hoc vn bn c d nh l ln hn. Thm ch ln hn vn bn xut hin trn in thoi nh. Ngoi ra xem xt s thch hp ca khong cch ch v khong cch dng gi cho ni dung ca bn c th c c cng tt Flash, Java, cc khung hnh v ca s Ups Pop Hu ht cc thit b di ng khng h tr, Flash, Java Applet, khung v ca s pop up.Hy trnh cc cng ngh ny khi pht trin trang web di ng ca bn. Vi thng bo gn y ca Adobe m h ngng pht trin Flash Player cho cc trnh duyt trn cc thit b di ng. Cch nhn ca CSS v in thoi di ng Di y l mt s li khuyn chung ca CSS cn nhc khi thit k dnh cho in thoi di ng. o Thit lp rng wrapper ca bn t l phn trm so vi rng c nh trang ca bn s qun kch c mn hnh khc nhau o Set on vn, tiu v nh hng hin th khi in hnh o in thoi di ng Safari khng h tr y @ font-face o Hy nhn vo CSS3 truy vn truyn thng cho vic to ra mt phin bn di ng ca trang web ca bn. o gi cho mi th n gin v sp xp hp l. Cc b cng c giao din ngi dng di ng v cc biu tng Nu bn nghing nhiu hn mt cht v cc bn pht trin so vi thit k, khng cn phi lo s. C rt nhiu cc b cng c giao din ngi dng c sn cho cc trang web in thoi di ng

4. Cc thnh phn chnh ca thit k di ng.

Xc thc v y quyn 6|Page

Vic thit k mt xc thc c hiu qu v chin lc y quyn l quan trng vi vic bo mt v tnh tin cy ca ng dng. Tnh xc thc yu c th khin ng dng ca bn b s dng tri php. Thit b di ng thng c thit k cho ngi s dng duy nht v thng thiu h s v bo mt. Kh nng ca cc thit b di ng qua bluetooth cng c th mang n nhng ri ro cho ngi s dng. Thit k di ng gp kh khn do b gin on kt ni. Vic thit k xc thc v y quyn: Thit k xc thc v y quyn cho c hai kt ni y v kt ni khng y ; bao gm ng b ha trong khng gian, ng b ha ti PC, pht hin ra bluetooth, ng b ha trn mng ring o v ng b ha th nh SD. Cc thit b khc nhau phi khc nhau trong m hnh bo mt chng trnh ca chng, l ci m c th nh hng n y quyn truy cp ti nguyn. Khng m bo c rng bo mt c sn trn cc nn tng ln hn s c trong di ng. Ngay c khi bn ang s dng cc cng c tng t. V d: danh sach kim sot truy cp (ACL) l khng c sn trong window mobile v do bo mt tp tin khng c trong hot ng h thng. Caching: b nh m. S dng b nh m ci thin hiu nng v p ng trong ng dng v h tr hot ng khi khng c kt ni mng. B nh m c th ti u ha tra cu d liu tham kho, trnh i ng vng v ngn chn x l khng cn thit. Khi quyt nh nhng d liu vo b nh m xem xt gii hn ti nguyn ca thit b; bn s c khng gian lu tr t hn so vi my tnh bn. Cc hng dn thit k b nh m: 7|Page

Xc nh mc tiu hiu sut ca bn. V d: xc nh thi gian p ng ti thiu v tui th ca pin. Kim tra hiu nng ca thit b c th s s dng. Hu ht cc thit b di ng ch s dng b nh flash, c th chm hn s vi b nh c s dng trong my tnh bn. Thit k b nh ti thiu. B nh cache ch cha d liu l hon ton cn thit cho cc ng dng hot ng Chn v tr thich hp b nh cache, chng hn nh trn cc thit b, ti cng di ng hay trong my ch c s d liu. m bo rng d liu nhy cm c m ha khi b nh m, c bit l khi d liu b nh m trong cc phng tin truyn thng khng nhng th cng xem xt vic m ha d liu trong b nh m trong b nh thit b di ng. Xc nh ranh gii tin cy vi tng ng dng di ng: gia my ch v my khch, gia my ch vi c s d liu. iu ny gip bn xc nh u v lm nh th no chng thc. Truyn thng: Communication Thit b truyn thng bao gm truyn thng khng dy v truyn thng c dy vi mt my ch.cng nh truyn thng thng qua bluetooth hay cng hng ngoi. Khi truyn thng qua khng kh th ch trng vic bo v trnh b trm cp, gi mo. Nu ang giao tip qua cc giao din dch v web, s dng c ch nh tiu chun ws-sercure m bo d liu. Giao tip thit b khng dy c nhiu kh nng b gin on hn so vi thng tin lin lc t mt my tnh v ng dng ca bn c th c yu cu hot ng trong thi gian di trng thi b ngt kt ni. Hng dn thit k chin lc truyn thng: 8|Page

Thit k khng ng b, truyn thng theo lung ci thin hiu nng v kh nng s dng trong vc kt ni. Gii hn bng thng kt ni trn cc thit b di ng c th lm gim hiu sut v nh hng n kh nng s dng. S dng cc giao thc truyn thng ph hp, xem xt cc ng dng hot ng khi nhiu loi kt ni c sn. Hy xem xt cho php ngi dng la chn kt ni s dng, v tt thng tin lin lc bo v pin ph hp. Nu ang thit k 1 ng dng chy trn thit b di ng xem xt cc tc ng nhn c mt cuc gi in thoi trong qu trnh truyn thng hoc thc hin chng trnh. Thit k ng dng cho php dng v hot ng li hay thm ch thot khi ng dng. Bo v thng tin lin lc trn cc kt ni khng ng tin cy, chng hn nh cc dch v web v cc phng thc qua khng gian. Xem xt s dng m ha v ch k in t cho cc d liu nhy cm v m bo d liu i qua VPN c bo v. Nu bn ang s dng WCF giao tip v phi thc hin hng i tin nhn, xem xt vic s dng WCF lu tr v chuyn tip. Qun l cu hnh Khi thit k qun l cu hnh thit b xem xt lm th no x l thit b reset, cng nh vic bn mun cho php cu hnh ca ng dng qua khng kh hay t mt my ch. Xem xt cc hng dn sau y: Chn mt nh dng ph hp vi thng tin cu hnh. Xem xt mt nh dng nh phn trn XML gim thiu s dng b nh. m bo rng vic m ha d liu lu tr trong tp tin cu hnh.

9|Page

m bo rng thit k ca bn h tr khi phc cu hnh sau khi reset thit b. Lm th no ng b ha thng tin cu hnh khi kt ni qua khng kh hay ti mt my tnh. Nu bn c mt c s h tng Active Directory, xem xt vic s dng giao din h thng qun l trung tm thit b di ng qun l cu hnh nhm, xc thc v y quyn ca cc thit b. Truy cp d liu Truy cp d liu trn thit b di ng b hn ch bi kt ni mng khng ng tin cy v hn ch phn cng ca chnh thit b . Khi thit k truy cp d liu, xem xt lm th no bng thng thp, tr cao v kt ni lin tc nh hng n thit k. Hng dn thit k sau y: Xem xt vic s dng mt c s d liu thit b cc b cung cp dch v ng b ha chng hn nh SQL server compact edition. Khng m bo rng thit b lu tr s lun lun c sn, nh mt ngi s dng c th xa vo bt k thi gian no. Kim tra s tn ti ca mt thit b lu tr di ng trc khi s dng FlushFileBuffers. Nu s dng XML lu tr hoc chuyn d liu. Xem xt kich thc tng th ca n v tc ng n hiu sut XML lm tng bng thng v cc yu cu lu tr a phng. Gim thiu tc ng hiu qu bng cch thit k truy cp c s d liu hiu qu v x l d liu. Hy xem xt vic s dng cc i tng nh my thay v tp d liu gim chi ph b nh v ci thin hiu sut. Trnh qu trnh hot ng chuyn su, iu hng thng qua cc tp d liu ln. Cc c trng ca thit b Thit k thit b di ng v pht trin l duy nht do tnh cht hn ch v khc nhau ca thit b phn cng. Gi cho mi trng thit b khng ng nht khi thit k ng dng di ng. Yu t trong s thay i kch thc mn hnh v nh hng, hn ch b nh v khng gian lu tr v bng thng kt ni mng. La chn h iu hnh di ng ph thuc vo loi thit b. 10 | P a g e

Ti u ha ng dng cho thit b bng cch xem xt cc yu t kch thc mn hnh v nh hng, mng bng thng, khng gian b nh lu tr, hiu sut x l , kh nng cc phn cng khc. Xem xt thit b c th m s dng tng cng chc nng ng dng nh x l ha n v, GPS, thng tin phn hi.... Nu ang pht trin nhiu hn mt thit b thit k u tin cho cc tp con ca cc chc nng tn ti trn tt c cc thit b v sau ty chnh pht hin v s dng cc tnh nng thit b c th khi c sn. Xem xt cc ti nguyn b nh hn ch v ti u ha cc ng dng ca bn s dng ti nguyn ti thiu ca b nh. Khi b nh thp, h thng c th pht hnh lu tr m ngn ng trung gian gim b nh ring. To m module cho php loi b module d dng t vic thc thi. iu ny bao gm cc trng hp ring bit cc tp tin thc thi nh hn c yu cu do hn ch v kch thc b nh in thoi. Qun l ngoi l Thit k mt chin lc qun l ngoi l hiu qu l quan trng i vi bo v tin cy ca ng dng. X l ngoi l trong ng dng di ng ngn nga nhng chi tit ngoi l nhy cm c tit l cho ngi s dng. Ci thin mnh m ng dng. Hng dn thit k: Thit k ng dng khi phc li trng thi tt c bit n sau khi xy ra trng hp ngoi l m khng tit l vi ngi s dng cui cng. Ch bt ngoi l nu bn c th x l chng v khng s dng ngoi l kim sot lung logic. m bo rng thit k mt li x l tng th nm bt cc trng hp ngoi l khng c qun l. Thng bo y thng tin lu tr v cc ngoi l. m bo cc tin nhn ngoi l thn thin s dng v chng khng tit l thng tin nhy cm v cc li quan trng v trng hp ngoi l. Logging

11 | P a g e

Do b nh hn ch c sn trn cc thit b di ng, logging v thit b o c nn c gii hn ch cc trng hp cn thit nht. Xem xt thc t mt s cc bn ghi c th c c to ra trn thit b v phi c ng b vi my ch. Khng c c ch ghi s kn trong windows mobile. Xem xt s dng c ch th 3 logging h tr NET framwork compact. Ngoai ra xem xt lm th no bn s truy cp cc bn ghi c lu tr trn thit b. Nu bn thc hin logging trn thit b xem xt vic ng nhp vo mt nh dng vit tt hoc nn gim thiu tc ng b nh v lu tr. Ngoi ra xem xt vic logging thay v ng nhp trn thit b. Xem xt vic s dng tnh nng nn tng nh theo di tnh trng trn my ch, cc dch v thit b di ng trn cc thit b, ng nhp v kim ton cc s kin. Khm ph thm kh nng theo di tnh trng t xa bng cch s dng thit b qun l Open Mobile Alliance tiu chun. ng b ha gia cc bn ghi c s d liu di dng v cc bn ghi c s d liu trn my ch duy tr kh nng kim ton trn my ch. Khng lu tr thng tin nhy cm trong cc tp tin ng nhp v kim ton, tr khi cn thit v m bo rng thng tin nhy cm c bo v thng qua m ha. Cc ng dng cng Cc nh pht trin thng mun nhc n cng nh mt phn ca ng dng di ng. Mt s loi ng dng s d dng hn trong vic kt ni ti cng. Hy xem xt cc trng hp thit k cng sau y: Nu bn ang cng c nhiu khch hng t my tnh bn, vit li ng dng trong ton b ca n. Thit k ph hp vi mt kch thc mn hnh nh, b nh hn ch v ngun ti nguyn a. Nu bn ang cng ca ng dng web ti thit b di dng, xem xt vic vit li UI cho mn hnh c nh. Ngoai ra, xem xt hn ch thng tin lin lc, giao din chng c th chuyn thnh in nng tng ln v chi ph kt ni cho ngi s dng. 12 | P a g e

Khng m bo rng ban c th chuyn iu khin ty chnh ca mt ng dng di ng m khng sa i. H tr cc API, b nh v cc hnh vi giao din ngi dng khc trn mt thit b di ng. Kim tra kim sot cng sm cng tt bn c th lp k hoch vit li chng hoc tm mt s thay th nu cn thit. Qun l nng lng Nng lng l yu t thit k gii hn chnh cho cc thit b di ng. Tt c cc quyt nh thit k nn a vo ti nguyn bao nhiu ngun tiu th thit b v nh hng ca n ti tui th ca pin. Xem xt cc thit b c th rt ra nng lng t USB hoc cc lai kt ni khc. Thc hin h s nng lng tng hiu sut khi thit b c sc t bn ngoi v khng sc pin ca n. Cho php ngi s dng tt cc tnh nng ca thit b khi khng s dng hoc khi khng cn thit. V d: n mn hnh, GPS, loa..... tit kim pin khng cp nht giao din ngi dng trong khi ng dng ang chy. Chn giao thc, giaod in dch v thit k v hng lot thng tin lin lc chuyn s lng nh nht ca byte c th c trong khng gian. Xem xt s dng nng lng cng nh tc mng khi la chn phng php giao tip. ng b ha Xem xt bn c mun c h tr ng b ha. Bi v ng b ha thng lin quan n d liu quan trng, xem xt th no m bo ng b ha d liu ca bn.c bit ng b ha qua khng gian. Thit k ng b ha ca bn x l cc thit b gin on kt ni hoc bng cch hy b cc hot ng hoc bng cch cho php n kt ni tr li. Hy xem cc hng dn thit k ng b ha: Nu ngi dng s dng ng b ha vi my tnh hy xem xt n kh nng ng b c t trong thit k ca bn. Nu ngi dng s dng ng b ha d liu khi ra khi vn phng, xem xt bao gm ng b ha khng gian trong thit k ca bn. 13 | P a g e

m bo rng cc ng dng c th phc hi khi ng b ha c thit lp hoc khi ng b ha b gin on v quyt nh cch bn s qun l xung t ng b ha. m bo rng thng tin lin lc ng b ha c bo v, c th s dng m ha v chng ch k thut s v s dng cc knh an ton. m bo p dng xc thc v y quyn ph hp khi s dng ng b ha bluetooth. Xem xt vic lu tr v ng b ha bng cch s dng WCF hn l email hoc tin nhn SMS nh WCF m bo giao hng v hot ng tt trong cc tnh hung kt ni khng thng xuyn. Testing G li ng dng di ng c th tn km nhiu hn chi ph g li 1 ng dng tng t trn my tnh. Xem xt chi ph g li khi quyt nh cc thit b v nhiu thit b ng dng ca bn s h tr. C th kh khn hn c c thng tin g li thit b v gi lp thit b khng phi lc no cng hon ton m phng mi trng phn cng thit b. Hng dn thit k kim th: Bit chi ph g li ca bn khi la chn thit b h tr. Yu t trong cc cng c h tr ,chi ph ca cc thit b th nghim ban u v chi ph da trn phn mm gi lp thit b. Nu bn c quyn truy cp cc thit b vt l m bn ang tin ti, g li m trn thit b thc t l s dng mt trnh gi lp. Nu thit b khng c sn, s dng mt trnh gi lp cho chy th nghim ban u v g li. Nu bn l mt OEM v thit b ca bn c to ra lu rng n c th g looci mt chng trnh in thoi di ng trn my tnh chuyn dng da trn windows CE. Giao din ngi s dng Khi thit k giao din ngi dng cho mt ng dng di ng khng c gng thch ng hoc ti s dng giao din ngi dng t mt ng dng my tnh bn. Thit k giao din ngi dng trn thit b ca bn l n gin nht c th v thit k c bit da trn u vo v nhp d liu kh nng 14 | P a g e

hn ch s thch hp. Cc ch mn hnh s chy ton mn hnh v s ch hin th mt ca s duy nht ti mt thi im. Hng dn thit k giao din ngi s dng: Thit k cho mt ca s duy nht ton mn hnh giao din ngi dng. Nu thit b ca bn s l mt thit b ngi dng ch chy cc ng dng chnh, xem xt vic s dng kiosk. Hy nh rng windows mobile khng h tr ch kiosk. V, vy bn s cn phi s dng window CE. a vo ti khon kch thc mn hnh khc nhau v nh hng ca thit b mc tiu ca bn khi thit k giao din ngi dng ng dng ca bn. Ngoi ra, hay xem xt nhng hn ch p t bi kch thc mn hnh nh, gii hn API v gim phm v ca giao din ngi dng iu khin so vi cc mi trng my tnh bn. Thit k cho kh nng s dng bng cch h tr mn hnh cm ng hoc giao din ngi dng bt iu khin. Ni thanh trnh n v cc iu khin khc di cng ca mn hnh ngn chn bn tay ca ngi dng che khut mn hnh. H tr u vo mn hnh cm ng bng cch lm cho nt bm ln v t ra cc iu khin giao din ngi dng c th s dng bng cch s dng mt ngn tay hoc bt stylus cho u vo. Cung cp cho ngi s dng chi dn trc quan ca cc hot ng ngn chn. V d: con tr ng h ct. S xc nhn S dng xc nhn bo v cc thit b v ng dng ca bn v ci thin kh nng s dng. Xc nhn hp l gi tr u vo trc khi gi chng n mt my ch t xa c th lm gim truyn thng v ci thin hiu sut v kh nng s dng ca ng dng. c bit l trong cc tnh hung i khi kt ni hoc ngot kt ni. Khi thit k xc nhn. Xem xt cc hng dn sau y: Xc nhn d liu u vo bi ngi s dng nu c th ngn chn thng tin lin lc khng cn thit v my ch. iu ny cng lm cho cc ng dng p ng nhiu hn khi ngi dng nhp vo cc gi tr khng hp l. 15 | P a g e

Xc nhn tt c d liu nhn c trong qu trnh giao tip vi mt my ch trong thi gian qua cc thng tin lin lc khng gian. m bo rng bn bo v ti nguyn phn cng, chng hn nh my nh v bt u cc cuc gi bng cch xc thc m v hnh ng t u tnh nng ny.

5. Thit k cho mn hnh di ng .

Mn hnh ca ca cc thit b di ng c nhiu kch thc khc nhau.Ty thuc vo mi loi mn hnh m ta c th c nhng thit k khc nhau sao cho ph hp.Tuy nhin vic thit k c th tun theo cc nguyn tc chung sau: Cn bng S cn bng ph hp ca cc yu t l s cn thit i vi 1 mu thit k. Lut cn bng c 2 loi l cn bng i xng v cn bng bt i xng. Cn bng i xng biu th tt c cc yu t nh chiu cao, chiu rng ... c sp t 1 cch i xng trong trang. Cn bng i xng cp n tt c nhng g c sp xp trong 1 b cc. Cn bng i xng c chia ra lm nhiu loi nh cn bng o ngc, cn bng 2 trc, cn bng xuyn tm... Cn bng bt i xng t c khi khng c s i xng.Khi tt c cc yu t c xp t khng c s i xng vi nhau, cn bng bt i xng c thit lp. Nguyn tc cn bng c p dng trong rt nhiu thit k m tiu biu l thit k logo Nhp iu Nhp iu dng to nn s dch chuyn v iu hng ca tm nhn. N xy ra khi cc yu t trong 1 b cc c lp li. Nhp iu c to ra bng cch to nn 1 dng chy m m ca tm nhn. Nhp iu c dng nh 1 ng dn m do mt chng ta c th c c nhng phn quan trng ca 1 thng tin. N cn c gi l 1 mu thc ca ngh thut. Nhp iu rt quan trng v n ng 1 vai tr sng cn trong cuc sng vt 16 | P a g e

cht ca chng ta. Nhp iu gip chng ta nhn nhn ra trt t ca th gii chung quanh. Nhp iu c th to nn bng 3 cch l: s lp li, dng chui v dng s lin tc. Ngi ngh s, thng thng s dng tt c cc hnh thc ca nhp iu trong 1 b cc. H pht trin thnh 1 s lin kt ca nhp iu trong xy dng, v, cc sn phm th cng... 1 cch nhun nhuyn v kho lo to nn 1 tng th tuyt vi. Nhn mnh (Chnh ph) Nhng yu t cn phi ni bt th s cn c nhn mnh. S nhn c to ra bi s sp cc yu t 1 cch hp l. Hoc t chng v tr ng c ch bng cch dng s tng phn, c ngha l lm chng ni bt ln bng nhng nt c trng nh mu sc, hnh dng, t l. S nhn mnh hoc tng phn mang li s mun mu mun v cho 1 mu thit k. Mt s loi tng phn ph bin l: cong v thng, rng v hp, hoa m v x x ...Nhn mnh bng tng phn xut pht t rt nhiu phng cch, nhng cch ph bin nht c l l dng mu sc. S tng phn v ng nt, hnh dng v kch thc lm nn u th ca 1 chi tit so vi tng th. Th d nh 1 a hoa c t trc 1 bc tng tnh lng v n sc thu c hiu qu nhiu hn trong 1 mi trng n o no nhit. ng nht S n gin trong thit k dn n s nhn thc ch 1 cch d dng hn. S n gin l thc s cn thit, c bit trong trang thit k, to nn s r rng, sng sa. n gin S n gin trong thit k dn n s nhn thc ch 1 cch d dng hn. S n gin l thc s cn thit, c bit trong trang thit k, to nn s r rng, sng sa. Cn xng Cn xng l mi quan h gia hnh dng v kch thc. N gip cho chng ta t c s cn bng, ng nht cho 1 trang thit k. c c 1 17 | P a g e

s cn xng tt th cc yu t phi c chiu chnh. S iu chnh kch thc ca cc yu t vi 1 s cn xng hon ho to nn 1 mu thit k tt. chnh l s lin quan gia kch thc ca cc yu t vi nhau, v vi s cn xng tng th. S cn xng bao gm nhng mi lin quan l lin quan v chiu cao, chiu rng, chiu su v khng gian chung quanh. Khong khng gian m xung quanh 1 ch to nn 1 yu t gi l t l. Chng ta c th thy rng t l lin quan mt thit n cuc sng hng ngy ca chng ta. Chng ta i vo siu th mua 1 ci n ng trang tr cho cn phng v tm c 1 ci ng l ph hp trong con mt chng ta lc . Nhng khi v nh th mi nhn thy rng n qu to so vi cn phng. Chng ta khng thay i g ci n, nhng i vi khng gian chung quanh c s thay i v t l. i vi thit k cng vy. Bn c ng rng n rt ph hp trn mn hnh vi tnh, nhng khi in ra th l c 1 khang cch khng th khng xem xt. V vy ti sao ngi ta phi in nhng ma-kt en trng tm ra 1 trang thit k ph hp nht. Do c th ni rng t l l 1 yu t quan trng nht trong thit k, mc d n ch c xp v tr th 6 trong nhng yu t ca thit k (cc yu t kia l ng nt, phng hng, hnh dng, mu sc, cht liu v sng ti).

6. Cc cng c tr gip thit k di ng

Hin nay c kh nhiu cng c tr gip cho vic thit k di ng.Sau y l mt vi cng c thit k giao din cho hai h iu hnh cho thit b di ng ph bin nht hin nay l Ios v Android. 1. DroidDraw DroidDraw l 1 cng c h tr thit k giao din ngi dng cho cc ng dng trn in thoi thng minh hay my tnh bng Android. 2.Xcode Xcode l 1 mi trng pht trin c tch hp mnh m to ra cc ng dng tuyt vi cho Mac, iPhone, and iPad. Xcode bao gm cc cng c phn tch , iOS Simulator, v phin bn cui ca Mac OS X v iOS SDKs.Giao 18 | P a g e

din Xcode mang tnh lin mch cc tnh nng nh chnh sa code,thit k giao din vi Interface Builder, kim th v sa li bn trong 1 mn hnh. N cng tch hp Apple LLVM pht hin ra cc li bn vit hay thm ch t sa ng li cho bn. 3.PhoneGap Nn tng ca h cho php bn d dng xy dng ng dng da trn HTML5, nh cc ng dng gc vo 6 nn tng khc nhau 4. RhoMobile Cc khu hiu mt codebase, tt c cc in thoi thng minh kh nhiu cho bit tt c. 5. WordPress Mobile Edition cho ngi s dng WP Nu bn l mt fan hm m ca WordPress c mt s b sung in thoi di ng thn thin c sn. Mt c bit ni bt. WordPress Mobile Edition l mt plugin cho thy mt giao din c thit k cho mt thit b di ng khi khch truy cp n trang web ca bn trn mt thit b di ng. Trnh duyt di ng c t ng pht hin, danh sch cc trnh duyt di ng c th c ty chnh trn trang ci t.

7. V d minh ha cho cc thit b di ng c th.

Thit k phin bn website cho in thoi i ng:

19 | P a g e

Thit k ng dng cho in thoi tablet: ng dng c sch: 20 | P a g e

ng dng cp nht tin tc

8. nh gi tnh dng c ca giao din di ng.

21 | P a g e

S thnh cng nhanh chng ca Instagram (mt ng dng chia s nh trn in thoi di ng) chnh l nh thit k ca n rt bt mt,n gin v thn thin vi ngi dng ph hp vi mn hnh hin th nh nh in thoi. Khi m cc ng dng trn cc thit b di ng ngy cng nhiu th ngi dng li c nhng yu cu cao v giao din ng dng tin ch. Vic thit k giao din di ng m bo cho ngi dng tp trung vo cc tnh nng quan trng,d s dng, loi b s rm r trong thit k,ph hp vi vic hin th v phn gii mn hnh ca cc thit b di ng.

Ti liu tham kho : 1. http://www.slideshare.net/OpenRoad/mobile-ui-design-user-centereddesign-and-ui-best-practices 2. Adaptive Human-Computer Interfaces - A. F. NORCIO & J. STANLEY - Human Computer Interaction Laboratoryi " Information Technology Division. 3. http://www.goldmousedesign.com/2012/02/07/25-loi-khuyen-ve-thietke-cho-cac-thiet-bi-di-dong/ 4. http://www.yuiblog.com/blog/2007/10/02/challenges-of-interfacedesign-for-mobile-devices/ 5. http://smallsurfaces.com/ 6. http://designreviver.com/tips/8-useful-interface-design-techniquesfor-mobile-devices/

Phn chia cng vic: C nhm tham gia tm ti liu v chia nhau dch ti liu.ng gp ca c 4 thnh vin l nh nhau: 25%
22 | P a g e

23 | P a g e