Grunnur HÍ / UX hönnunarhugmyndamunur á vírgrind, frumgerð og líking

Mismunur þráðrammans, frumgerð og spotta ruglast alltaf af mörgum hönnuðum, þrátt fyrir reyndan hönnuð, sá ég að margir spurðu Quora og Reddit um þessi hugtök, svo það er bráðnauðsynlegt að gera sér grein fyrir hvað í fjandanum er það. Það myndi leysa mikið vandamál og spara orku fyrir hönnuðina.

Hvað er Wireframe?

Það er myndræn uppbygging vefsíðu eða forrits sem inniheldur innihald og þætti. Rétt eins og teikning byggingar, til að það verði að skýjakljúfi þarf mörg verk og þátttakendur að taka þátt í. Sömuleiðis lítur þráðramminn einfaldur út og þarf að auki verk sem UX, HÍ, IxD hönnuðir vinna. Í stuttu máli, Wireframe er hönnun með litla tryggð sem hefur 3 einföld en bein markmið:

  • Inniheldur helstu upplýsingar
  • Teiknaðu yfirlit yfir uppbyggingu og skipulag
  • Sjónræn og lýsing á notendaviðmóti

1. Sjónrænir eiginleikar wireframe

Sjónrænt er að vírgrindin eru mjög augljós sjónræn takmörkun, því það þarf aðeins einfaldar línur, kassa og gráan lit (mismunandi gráskalir gefur til kynna mismunandi stig) til að klára.

Wireframe er mjög augljós sjónræn takmörkun. Almennt þurfa hönnuðir aðeins að nota línur, kassa og gráan lit (mismunandi gráskalir gefur til kynna mismunandi stig) til að klára.

2. Einfaldur vírrammi fyrir vektor

Innihald einfaldrar vírgrindar ætti að innihalda myndir, myndband og texta osfrv. Því verður sleppt í staðinn fyrir staðsetningar, myndinni í staðinn fyrir skyggða og texti verður skipt út fyrir táknræn orð í samræmi við textaskipulagið.

3. Kostur wireframe

Uppbygging þráðramma er hröð og ódýr.

Sérstaklega ef þú notar nokkur wireframing verkfæri, svo aspaper og penna, Balsamiq. Auðvitað ættir þú að nota þessi hönnunarverkfæri til að gera það strax í byrjun.

Í samanburði við heill og ítarleg háþróað vírgrind er miklu auðveldara að safna endurgjöf í gegnum lo-fi þráðramma og mikilvægara. Af hverju? Vegna þess að fólk leggur meiri áherslu á virkni hugbúnaðar, upplýsingagerð, upplifun notenda, flæðirit yfir notendur og notagildi þess, frekar en að huga að fagurfræðilegu einkennum þessara þátta. Á sama tíma, í þessu tilfelli, geturðu auðveldlega breytt því í samræmi við eftirspurn, en ekki þörf á að aðlaga kóðun og grafíska klippingu.

4. Gagnvirk vírammi

Stundum kjósa hönnuðir að bæta tryggð vírgrindanna til að auka mikilvægi notendaviðmótsins við suma þætti og sýna skynsemi samspils hrattprófs og sjónrænna þátta. Forrit til að takast á við þessi vandamál á réttan hátt er að nota gagnvirka þráðramma, einnig þekktur sem smellanlegi þráðramminn.

Ef þú vilt búa til svo flókinn þráðramma þarftu UXPin, sem er tæki til að wireframing og frumgerð hönnun. Gagnvirk frumgerð getur verið besta kynningin fyrir þróunarteymi og viðskiptavini. Þegar þú rakst á vandamálið að „hvað mun það gerast þegar ég smelli á þennan hnapp?“ Þarftu bara að smella og sýna viðskiptavinum þínum hvernig það virkar á gagnvirkri frumgerð. Reyndar er það nokkuð áhrifamikið og bein.

5. Sýnið vírgrindina með varúð

Þú verður að vera varkár gagnvart gauranum sem er algerlega leikmaður þegar þú þarft að kynna vírgrindina fyrir honum. Hann gæti verið viðskiptavinur þinn, einnig gæti hann verið tæknilegur framkvæmdastjóri tók þátt í samstarfinu. En hann veit ekki sannleikann að vírgrindin og lokaafurðin virðast ótengd. Svo að hann skilur kannski ekki eðlislæga hlekkinn og aðgerðina á milli. Þannig þarftu að reikna út rétta ákvörðun hvort þú þarft að leggja fram og hvernig.

Wireframing hönnunarverkfæri

Pappír og penni

Auðveldasta valið hönnunarverkfæri fyrir wireframing er pappír og penni. Teiknaðu frjálslega á pappír með penna, það er einfaldasta vírgrindin með grunnlínum og kassa. Með því myndu hönnuðir kynna hugmyndirnar innsæi með ítarlegri textatjáningu eða munnlegri ræðu fyrir viðskiptavini og leiðtoga. En þetta væri ekki notað í formlegu verkefni fyrir stór fyrirtæki.

Balsamiq

Stundum kjósa hönnuðir að bæta tryggð vírgrindanna til að auka mikilvægi notendaviðmótsins við suma þætti og sýna skynsemi samspils hrattprófs og sjónrænna þátta. Balsamiq veitir safn af þáttum fyrir truflanir wireframing í tveimur stílum. Handteikningastíll hennar myndi hjálpa til við að einbeita sér að skipulagi, hönnun aðgerða, allir litir eru hvítir og svartir. Svo þú munt ekki heyra kvörtunina um litastillingarnar og sjónræn áhrif.

Hvað er frumgerð?

Krafan um frumgerð er hærri en þráðramminn. Munurinn er sá að frumgerð verður að vera mikil tryggð frumgerð sem er gagnvirk og passa endanlegt notendaviðmót eins og mögulegt er. Á sama tíma veitir það fullkomna notendaupplifun fyrir prófarana með því að líkja eftir raunverulegu vöruviðmóti og virkni samskipta.

1. Kostur frumgerð

„Hópvæn frumgerð er til þess fallin að stuðla að samskiptum hönnuða og þróunaraðila. “

Af hverju það er svona mikilvægt? Þar sem frumgerð er venjulega notuð til að prófa vöru. Frumgerð próf á mjög snemma stigi getur sparað mikinn þróunarkostnað og tíma. Svo að það muni ekki eyða áreynslu í bakgrunni vöru arkitektúr vegna óraunhæft gagnvirkt viðmót. Svo, frumgerð er fullkomin árangur til að prófa vöru fyrir hönnuði og verktaki.

Að auki að veita notendum frumgerðir til að safna endurgjöf, það er gagn að hafa innsýn í allar upplýsingar um vöruna þína og hvetja allt liðið. Mörg verkfæri frumgerða geta smíðað frumgerðir fljótt og vel, en enga erfðaskrá þarf.

Markmið frumgerðanna er nokkuð augljóst: að líkja eftir samspili notandans og viðmótsins eins raunhæft og mögulegt er. Þegar ýtt er á hnapp verður að framkvæma samsvarandi aðgerð og samsvarandi síður verða að birtast, reyndu besta til að líkja eftir fullri vöruupplifun. Þegar þú rakst á vandamálið að „hvað mun það gerast þegar ég smelli á þennan hnapp?“ Þarftu bara að smella og sýna viðskiptavinum þínum hvernig það virkar á gagnvirkri frumgerð. Reyndar er það nokkuð áhrifamikið og bein.

2. Sjónrænir eiginleikar frumgerð

Vafalaust verður frumgerðin að innihalda fagurfræðilegu eiginleika vöru sem ætti að hafa og reyna að passa endanlega útgáfu. Í grundvallaratriðum er það skinn af vöru, engin HTML / CSS / JS þátt, og ekki nauðsynlegt að huga að netþjóninum og gagnagrunninum.

3. Frumgerð próf

Frumgerðaprófun er lykilskref í hönnunarferli frumútgáfunnar sem er ein helsta áfangi í heildarferlinu. En hvernig eigi að framkvæma nothæfnisprófun er gríðarlega mikið umfjöllunarefni hér. Einfalt próf getur kostað um klukkutíma eða svo, það er nóg að prófa 5 eða 6 lykilmyndir. Hér eru nokkrar algengar spurningar til viðmiðunar:

  • Hvernig byrjar notandinn á verkefninu? (Leitar eða vafrar?)
  • Hvað gerir notandinn fyrst? og næst?
  • Hvernig tekur hann endanlega ákvörðun?
  • Skilja þeir hönnunaráætlunina? Einhver vandamál?

Það er stöðugt ferli til að framleiða frumgerð hönnunar og það þarfnast endurtekningar og endurbóta.

Frumgerðartæki

Ertu að leita að frábæru skjótur frumgerðartæki? Engin fjárhagsáætlun? Engin afsökun. Mockplus Black Friday 2017 er hér fyrir þig! Vertu með í Mockplus opinbera slaka hópnum núna, stjórnandinn mun bjóða þér 40% afslátt af afsláttarmiða og ókeypis UI pökkum og leturgerðum. Þetta tímatakmarkaða tilboð gildir fyrir alla pakka og stendur til 31. nóvember og sparar að minnsta kosti 80 dalir af venjulegu verði. Að auki færðu ókeypis tækniþjónustu fyrir lífstíma á Mockplus jafnvel þó að þú sért ekki borgaður notandi núna. Komdu og njóttu Mockplus Black Friday 2017!

Mockplus

Mockplus er allt innifalið prototyping tól fyrir skjótt samspil, hratt hönnun og fljótt forsýning. Það gerir kleift að búa til spotta fyrir farsíma (Android & iOS), Desktop (PC & Mac) og vefforrit. Í Mockplus 3.2 bætti það við UI Flow Design Mode, Repeater, Demo Verkefni og sniðmátum og Sketch Import. Aðrir eiginleikar eins og Mind Map Design Mode verða kynntir í útgáfunum á eftir Mockplus 3.2.

UXPin

UXPin hefur smíðað meira en 900 tegundir af mismunandi UI þætti fyrir þig til að búa til rammar og frumgerðir. Móttækilegur brotpunktur þess gerir notendum kleift að búa til móttækilegar frumgerðir og þráðrammar sem geta keyrt á mismunandi tækjum og upplausnum.

Hvað er spotta?

Mockup er „sjónræn handrit“ sem notað er til kynningar á heildar sjónrænum hönnun vörunnar. Það hefur ríkari sjónræn atriði en þráðrammi, þar á meðal grafík, skipulag, litur og önnur nákvæmari sjónræn framsetning. Að einhverju leyti er það endanleg hönnun vörunnar.

Eins og þráðramminn er Mockup kyrrstæður og óstarfhæfur. Það leggur áherslu á útlit vörunnar með því að bæta við mikið af sjónrænum þáttum til að ná í mikilli tryggð. Þetta er oft notað í umræðum um sjónhönnun til að fá skjót viðbrögð og endurbætur á sjónrænum hönnun vöru.

Hönnunarflæði

Eftir að þú hefur fengið innsýn í kjarna hönnunar og vitað muninn á wireframe, mockup, prototype, stendur þú fyrir framan hönnunarheiminn fyrir notendur.

Ef þú getur steypað röð vöruhönnunar í samloðandi og árangursríkt vinnuflæði, mun ótrúlegt þunnur gerast.

Ábendingar

  • Prófaðu að nota breytanlegan og endurnýtanlegan þátt þegar þú gerir rammar. Í því tilfelli heldurðu áfram að betrumbæta þættina til að ljúka frumgerðum sem byggjast á þráðramma.
  • Þegar þú býrð til þráðrammar skaltu reyna að safna hugsunum og skoðunum frá teymi þínu og viðskiptavinum og reyna að endurspegla þær um hönnunarviðrammann.
  • Notaðu handhægasta tækið þitt