Leyndarmálin til árangursríkrar kortagerðar
Þannig að þú vilt fá á þróun með kortastiku tengi? Það er líklega frábær hugmynd; kort eru vinsælar og notendavænir valkostir fyrir allar gerðir af stafrænni hönnun á mismunandi stærðum tækisins.
Lykillinn að korthönnun er að búa til eitthvað sem notendur vilja smella á. (Það er lykillinn að góðu korti.) Kortið ætti að vera ílát fyrir tiltekinn hluti af efni - innihaldslína, skráning, myndspilari og svo framvegis - sem notendur vilja eiga samskipti við.
Hér er hvernig þú hanna það ...
Byrjaðu með svarthvítu útliti
Það hljómar svolítið einfalt: Byrjaðu með svörtu og hvítu vírframleiðslu fyrir hönnunina. Hugsaðu um fyrirætlunina á kortinu og hvaða hlutar þess verður að smella eða tappa. (Allt kortið getur þjónað sem hlekkur.)
Skipuleggðu fyrir þætti eins og bil, myndir og leturfræði svo að þú getir séð kortið án litar eða útfærslu. Hugsaðu um það sem "spilakort" áfanga hönnunarinnar. Allar þættir á kortinu eru til staðar. Virðist það sem ramma sem auðvelt er að skilja?
Hugsaðu um hvernig þú ætlar að nota það frá þessu stigi. Hvar myndir þú smella fyrir aðgerð? Er mynstur og niðurstaða ljóst? Hvernig ferðu aftur eða fyrirfram? Svörin við þessum spurningum ættu að vera viðeigandi án vísbendinga eins og rauður "smellur hér" hnappur sem blikkar á skjánum.
Eins og með öll önnur verkefni, ef útlínan virkar ekki í svörtu og hvítu, mun endanleg hönnun líklega ekki heldur.
Notaðu ýkt bil
Stærsta áskorunin þegar það kemur að kortum er að búa til sams konar hönnun sem ekki líður ringulreið. Það er þar sem hvíldarhús kemur inn. Og þú vilt nota meira af því en finnst þægilegt í fyrstu.
Viðbótin af hvítum rúm mun gefa þætti meira pláss til að anda, sem gerir heildarkortið virkt rúmgott og aukið læsileiki.
Almennt gætirðu viljað byrja með tvisvar á bilinu sem þú gætir venjulega íhugað milli þætti. Gutters ætti að vera auka breiður og lína bil gæti notað aukalega herbergi eins og heilbrigður. Auka rúmið mun hjálpa þér að búa til opinn hönnun og skipuleggja innihald betur. Kortið hefur nokkuð takmarkaðan striga og ætti að passa á einum skjá í síma og svipaðan hluta skjásins á stærri tæki eins og töflur eða skjáborð. Spil geta einnig keppt gegn öðrum spilum fyrir athygli á stærri skjái. Bætt við hvítvín mun hjálpa öllu hönnuninni að virðast vera meira opið og auðvelt að kafa inn.
Bættu við náttúrulegum litum og skyggingum
Nú ertu tilbúinn að hugsa um lit og skygging fyrir hönnunina. Haltu það náttúrulega útlit og líkja eftir veruleika í skugganum og stílum hönnunarinnar.
Nei, við erum ekki að tala um skeuomorphism hérna, við erum að tala um að búa til lit með náttúrulegum útlínum og skuggum. Hugsaðu um hvernig kort verður skoðað. Notandinn ætti að fá sömu tilfinningu eins og hann hafi raunverulega haft það.
Notaðu nokkrar grundvallarreglur eðlisfræðinnar til að ímynda (og hanna) hvert kort eins og það væri haldið:
- Ljósahönnuður ætti að skila nokkrum skuggum til baka og neðst.
- Myrkasta hluta hönnunarinnar er líklega neðst, þökk sé birtuskilyrðum, sem venjulega koma frá ofan.
- Forðastu efni á svæðum sem þarf til að halda kortinu.
- Snertipunktir (og tengd símtöl til aðgerða) eiga að vera brennivídd og auðvelt að hafa samskipti við. (Rétt eins og andlit spilakorts er í miðju hönnunarinnar.)
- Eitt kort jafngildir einum upplýsingum.
Búðu til einfaldar lög
Nú þegar þú ert að hugsa um eðlisfræði, taktu það á næsta stig með einfaldri layering til að búa til samræmda kortastíl fyrir allt tengið. Ekki viss hvar á að byrja? Google Efni Hönnun leiðbeiningar eru frábær upphafspunktur.
"Í efni hönnun eru eðliseiginleikar pappír þýdd á skjáinn. Bakgrunnur umsóknar líkist íbúð, ógagnsæ áferð blaðs pappírs.
Hegðun umsóknar líkja eftir getu pappírsins til að endurmeta, stokka og binda saman í mörgum blöðum. Þættir sem búa utan forrita, ss stöðu- eða kerfisstikur, fá aðra meðferð. Þau eru aðskilin frá forritinu innihaldinu undir þeim og bera ekki eðlisfræðilega eiginleika pappírsins.
Brjóta þetta niður og það fer aftur til að gera stafræna hlutinn líta út og líða líkamlega. Og ef notendur vilja snerta það, þá viltu smella á það. Hugmyndin er bara svo einföld.
Haltu við einföldum leturritum
Þegar það kemur að leturfræði eru einfaldar sans serifs oft svarið. Forðastu frábæran þunn eða þéttan valkost vegna þess að þau geta verið nokkuð erfiðari í augum.
Flestir spilin virka best með tveimur letrivalkostum (jafnvel þótt þeir séu frá sömu fjölskyldu) - eitthvað fyrir aðal líkamann og annað fyrir fyrirsögnina eða kalla til aðgerða. Mikilvægasti þátturinn þegar kemur að leturfræði er að muna að innihalda nóg andstæða þannig að textareiningar séu auðvelt að lesa. Mundu að innihalda andstæða á milli leturs og skugga milli bakgrunns og textaþátta fyrir hvert kort.
Takmarka UI-þætti
Endurtaktu eftir mér: Eitt kort er eins og ein aðgerð.
Svo þýðir það sennilega að þú þarft ekki að innihalda fullt af notendaviðmótum eins og hnöppum yfir hönnunina.
Þú gætir ekki einu sinni þörf á hnappi yfirleitt í hönnun með kortum stíl.
En ef þú heldur að notendur þurfa sjónrænt merki, þá er ein hnappur nóg. Halda lögun og hönnun einfalt - aftur er Material Design nálgunin góð kostur - og haltu bara við einn hnapp.
Hnappur er líklega eina UI þátturinn sem þú þarft. Þetta er markmið þín með hönnun.
Niðurstaða
Það er ekki töfraformúla fyrir hið fullkomna kort, en það eru nokkrar hönnunarvalkostir sem þú getur gert sem hvetja alla notendur til að smella á (eða smella á). Haltu hönnuninni miðju í raun og veru, fylgdu lægstur nálgun með nóg plássi og andstæða, leggðu áherslu á einfaldar leturfræði og búðu til eina aðgerð fyrir hvert kort.
Í kjölfar þessarar yfirlits mun þú hjálpa þér að ímynda þér og hugmynda kortastarfsemi sem notendur vilja eiga samskipti við. Sameina þessar hugmyndir með hönnunarkennslu og óguðlegan kunnáttu þína fyrir frábært verkefni sem verður gaman fyrir notendur og fagurfræðilega á þróun.