Nilalaman
- 1. Huwag markahan ang mga sapilitan na patlang
- 2. Huwag gumamit ng mga manunulid
- 3. Magkaroon lamang ng isang uri ng pindutan o mas mabuti pa rin isang pindutan bawat form
- 4. Mga bukirin ng tipak
- 5. Isipin kung bakit ka humihiling ng isang bagay at kung ano ang pakiramdam nito sa gumagamit
- 6. Ang mga petsa ay mahihirap na maliit na fellas
- 7. Mga form bilang developer craft
- 8. Huwag gumamit ng mga haligi sa mga form
- 9. Huwag gumamit ng dalawang patlang kung kailan gagawin ng isa
- 10. Maging mabait ka
Mga form, wala nang mas maraming mga taga-disenyo ang naiinis kaysa sa mga form. Hindi nila kinakailangang ilabas ang pagkamalikhain, o gagawin nila? Marahil ay oras na tiningnan natin muli ang mga form at nauunawaan na ang isang form, sa pinaka pangunahing kaalaman nito, ay isang pag-uusap sa pagitan ng gumagamit at ng software.
Kalimutan ang punto at pag-click, ang mga form ay kumakatawan sa pinakamayamang pakikipag-ugnayan na kakaharapin namin bilang mga digital na taga-disenyo. Sa susunod na dumating ang isang form sa iyong paraan huwag isipin na isang bagay lamang sa paglalapat ng ilang magagandang mga epekto ng CSS o pagdaragdag ng isang magandang jQuery na yumayabong. Mayroong higit na lalim sa pagdidisenyo ng mga form.
Sinubukan ko na ang gumagamit ng daan-daang mga form at nagdisenyo ng ilang mga kumplikadong form para sa mga kumpanya ng seguro, pakikipag-ugnayan sa pag-book ng holiday at marami pa. Malamang na nagamit mo ang isa sa aking mga form sa huling ilang buwan.
Narito ang mga aralin na nais kong natutunan bago ako magsimulang mag-disenyo ng mga form.
1. Huwag markahan ang mga sapilitan na patlang
Alam mo ang maliit na asterisk na nagsasaad ng isang sapilitan na patlang? Nakita kong nabigo ito ng maraming beses sa pagsubok ng gumagamit. Bilang isang konsepto, walang katuturan ang mga ipinag-uutos na patlang, wala silang katumbas na offline. Mahusay sila para sa mga developer dahil nag-aalok sila ng magandang itim at puti na diskarte sa pagkumpleto. Nabigo ang patlang ng asterisk at sapilitan sapagkat ito ay isang natutuhang kilos. Karaniwang pag-uugali na nakita ko sa pagsubok ng gumagamit ay ang gumagamit na kinukumpleto ang form sa tuktok at tinatapos alinman kung may pumipigil sa kanila o na-hit nila ang isang pindutan.
Ang solusyon ay simple, markahan ang mga opsyonal na patlang, markahan ang lugar kung saan dapat tumigil at isipin ang aming magaling na gumagamit kung kailangan nilang kumpletuhin ang patlang na iyon.
2. Huwag gumamit ng mga manunulid
Ang HTML5 ay napakatalino di ba? Nag-aalok ito ng maraming nakagaganyak na mga bagong makintab na tool upang mapaglaruan. Kailangan nating isipin ang tungkol sa pagiging naaangkop ng aming mga bagong laruan. Ang patlang ng numero ngayon ay nagsasama ng maliit at pataas na mga arrow upang payagan ang gumagamit na paikutin ang mga numero.
May dalawang problema dito. Una sa default na pagpapakita ng browser ng mga arrow ay napakaliit nila. Napaka fiddly upang mag-click at ang taba na palasingsingan sa gitna natin ay magpupumilit sa isang iPhone. Tinatawag itong Batas ng Fitt, kung mas maliit ang isang bagay ay mas mahirap itong mag-click dito.
Ngunit naririnig kong sumigaw ka, maaari mo lamang mai-type ang numero nang direkta sa patlang ng numero. Oo, maaari mo, ngunit tingnan natin ang display ng browser, ang mga arrow ng paikot na pababa / pababa ay kahawig ng aming mapagkakatiwalaang kaibigan ang napiling kahon. Ang isang gumagamit na ipinakita sa pamamagitan ng isang manunulid sa unang pagkakataon ay ipagpapalagay, dahil ito ay kahawig ng isang piling kahon, na hindi nila ito mai-type.
Ang payo ko ay upang makaiwas hanggang sa maging mas karaniwang lugar o pag-uri-uriin ng mga developer ng browser ang default na disenyo.
3. Magkaroon lamang ng isang uri ng pindutan o mas mabuti pa rin isang pindutan bawat form
Mayroong isang maliit na kilalang prinsipyo ng sikolohiya na tinatawag na Hick's Law. Nakasaad sa Batas ng Hick na mas maraming mga pagpipilian na inaalok sa atin mas mahirap ito upang pumili. Hindi alam kong rocket science, ngunit isang patakaran na nagkakahalaga ng pag-iisip.
Matutulungan mo ang iyong magaling na gumagamit sa pamamagitan ng pagtulong sa kanila na pumili. Sa pamamagitan ng paggawa ng lahat ng pangunahing mga pindutan ng isang kulay, at pagkakaroon ng isa lamang sa mga ito sa bawat pahina ay ginagawang mas madali ang pagpipilian. Alin ang pindutan na dapat kong tama? Oh, madali lang, ito ang malaking kulay.
4. Mga bukirin ng tipak
Nag-aral ako ng neuroscience sa isang nakaraang buhay at sa gayon ay pinag-aralan ang sikolohiya ng memorya - partikular na panandaliang o memorya ng pagtatrabaho. Ngayon bago mo sabihin ito; hindi, ang panandaliang kapasidad sa memorya ay hindi 7 +/- 2, 4 +/- 1 o sa tao nagsasalita ng tatlo hanggang limang mga tipak. Kami bilang mga tao ay mahusay sa pagsusuri ng mga visual stimuli, ang hadlang ay mas mahusay kami kapag ang bilang ay mas maliit. Ang pag-chunk ng form sa mas maliit na mga grupo ay ginagawang madali ang pagsusuri, tulad ng madalas na ipasok ng gumagamit sa form na nagmula sa kanilang memorya.
Tiyaking ang iyong mga pangkat ng patlang ay halos apat ang haba.
5. Isipin kung bakit ka humihiling ng isang bagay at kung ano ang pakiramdam nito sa gumagamit
Marahil ito ang pinaka-tuwid na payo ng payo na ibinibigay ko ngunit madalas ay hindi gaanong ginagamit.
Gawin natin ang sumusunod:
Tanungin ang bawat tanong na tatanungin mo. Kailangan ba Ano ang pakiramdam na tinanong ito?
Mas madalas kaysa sa hindi kailangan ng isang negosyo na magtanong ng isang katanungan at kami bilang mga taga-disenyo ay maaaring magtaltalan tungkol sa pangangailangan hanggang sa kami ay asul sa mukha. Ang tanong ay dapat itanong. Sa pag-unawa sa kailangan ng negosyo para sa data na ito maaari naming madalas na makompromiso.
Makakatulong kami sa pamamagitan ng pagsabi sa aming magaling na gumagamit kung bakit kailangan naming tanungin ang katanungang iyon. Tiyakin ang tungkol sa paggamit at pagbabahagi ng data na iyon at sa pangkalahatan ay maging maganda.
Pagkuha ulit ng aming halimbawa:
Mahirap pa rin itanong ngunit sana pinatamis namin ang tableta.
6. Ang mga petsa ay mahihirap na maliit na fellas
Ang pagpasok ng mga petsa ay maaaring maging isang tunay na hamon at doon ng ilang mga pitfalls na maaari mong maiwasan. Ang nag-iisang pinakamalaking problema ay ang pagharap sa mga error.
Ang pinakamadaling diskarte ay upang ilunsad ang isang kalendaryo. Mahalagang tandaan na ang mga linggo ay nagsisimula sa isang Lunes sa UK at isang Linggo sa US. Kung ang iyong gumagamit ay hindi nakatuon sa mabuti maaari silang pumili ng isang Linggo kapag nangangahulugan sila ng Lunes.
Sulit din na banggitin ang mga format ng pang-internasyonal na petsa. Inilalagay muna ng US ang buwan, sa Japan ito ay unang taon. Kaya't ang isang petsa tulad ng 4/5/12 ay maaaring bigyang kahulugan sa tatlong paraan.
Iyon ang dahilan kung bakit pinakamahusay na gumamit ng mga piling kahon.
7. Mga form bilang developer craft
Ang mga form ay bapor para sa mga developer pati na rin ang mga taga-disenyo. Ang pag-unawa sa kung anong mga posibleng pagkakamali na magagawa sa pagpasok ng data at pagdidisenyo ng iyong back-end code upang makayanan ay isang hamon.
Narito ang isang simple. Pagpasok ng isang halaga ng pera. Ang mga posibleng pagkakamali na magagawa ng gumagamit ay napakalaki. Ang sapilitang mga format ng data na kailangang matugunan ng mga gumagamit ay nakakabigo para sa iyong gumagamit at, harapin natin ito, medyo tamad sa bahagi ng mga developer.
Ano ang mas mahusay na hamon para sa isang developer kaysa sa pagbuo ng isang form na walang katibayan ng bala.
8. Huwag gumamit ng mga haligi sa mga form
Ang malaking problema sa paggamit ng mga haligi sa mga form ay daloy. Nagsisimula kami ng isang form sa itaas at nagtatapos sa ibaba. Sa pagpapakilala ng mga haligi ang daloy ng form ay maaaring masira.
Huwag ipalagay ang tab ng mga gumagamit sa pamamagitan ng mga form at samakatuwid ang pagtuon ay isang paraan ng pag-navigate sa mga form sa mga haligi. Bihirang nakita ko iyon sa pagsubok ng gumagamit. Karamihan sa mga oras na nakikita nating ipasok ang mga detalye, mag-click sa susunod na patlang gamit ang mouse / trackpad / daliri pagkatapos ay ipasok ang mga detalye at iba pa.
9. Huwag gumamit ng dalawang patlang kung kailan gagawin ng isa
Karamihan sa mga tao ay hindi hinihipo ang mga typista. Sa pagsubok ng gumagamit nakikita namin ang mga tao na tumitingin sa keyboard habang nagta-type sila.
Kapag pumapasok sa isang numero ng telepono na pinaghihiwalay ang patlang ng form, sabihin na magdagdag ng area code at numero, ay nagdudulot ng totoong mga isyu. Hindi nakikita o naaalala talaga ng mga gumagamit na mayroong dalawang mga patlang kaya ipasok ang buong numero sa unang patlang, mas masahol pa kung ang patlang ay limitado sa isang tiyak na bilang ng mga character.
Gumamit lamang ng isang patlang para sa numero ng telepono, pareho ang totoo sa numero ng bahay / kalye - gumamit lamang ng isang kahon ng text entry.
10. Maging mabait ka
Magulat ka tungkol sa kung gaano karami ang medyo bastos na mga mensahe ng error doon.
Narito ang isang halimbawa ng isa na napag-aralan ko kamakailan.
Ang mismong katotohanan na nagmumungkahi sila na kusang loob kang maglalagay ng isang petsa sa hinaharap at pagkatapos ay isang medyo pangmukhang tugon, aba, hindi ito gaanong maganda.
Muli inilagay ang iyong sarili sa lugar ng gumagamit, ano ang pakiramdam mo na nakikita mo ang error na ito? Naiinis? Baka masama pa. Madali ang pagiging mabait.
Gumawa ako ng isang nada-download na kuna / cheat sheet upang matulungan kang magdisenyo ng mas mahusay na mga form. May kasamang maraming mas pinakamahusay na mga paraan ng kasanayan upang mag-disenyo ng mas mahusay na mga form.
