UI / UX põhikontseptsiooni kontseptsiooni erinevus raami ja prototüübi vahel

Vaatamata kogenud disainerile ajavad disainerid alati segamini mõistete „raami raam” ja „prototüüp” segadused, mis võivad olla tingitud arusaamatusest või mõnel muul põhjusel. Tegelikult on mõiste nende kahe mõiste vahel üsna ilmne ja erinev. Nüüd eristame need kaks terminit selgelt.

Mis on raamiraam?

Traatraam on kujunduse madala täpsusega paigutus, millel on 3 lihtsat, kuid otsest eesmärki:

1. Esitleb peamist teabegruppi

2. Joonistage struktuuri ja paigutuse kontuur

3. Kasutajaliidese visioon ja kirjeldus

Pärast traatkarkassi õigesti loomist saab see teie toote põhistruktuuriks. Nii nagu hoone plaan, kirjeldab see detaile selgelt ja konkreetselt.

Raamraami visuaalsed omadused

Raami on olemas väga ilmsed visuaalsed piirangud. Üldiselt peavad disainerid täitmiseks kasutama ainult jooni, kaste ja halli värvi (erinev halltoon näitab erinevat taset).

Lihtne vektorraami

Lihtsa kaadriraami sisu peaks hõlmama pilte, videot ja teksti jne. Seega asendatakse väljajäetu kohahoidjaga, pilt asendatakse varjutatud tekstiga ja tekst asendatakse mõne sümboolse sõnaga vastavalt teksti paigutusele.

Raami eelis

Raamiraami ehitamine on kiire ja odav, eriti kui kasutate neid prototüüpimisvahendeid nagu UXPin, Mockplus, Balsamiq ja Axure. Muidugi peaksite neid prototüüpimisriistu kasutama, et seda kohe alguses teha.

Võrreldes täieliku ja üksikasjaliku ülitäpse juhtraamiga on tagasiside kogumine palju olulisem. Miks? Kuna inimesed pööravad nende elementide esteetiliste omaduste arvestamise asemel rohkem tähelepanu tarkvara funktsionaalsusele, teabe arhitektuurile, kasutajakogemusele, kasutaja interaktsiooni vooskeemile ja selle kasutatavusele. Vahepeal saate sel juhul seda hõlpsalt vastavalt nõudlusele muuta, kuid te ei pea kodeerimist ja graafilist redigeerimist kohandama.

Interaktiivne raamiraam

Mõnikord eelistavad disainerid parandada kaadrite täpsust, et suurendada kasutajaliidese olulisust mõnes aspektis ning näidata kiire testi ja visuaalsete elementide vahelise interaktsiooni mõistlikkust. Programm nende probleemide korrektseks lahendamiseks kasutab interaktiivset raamiraami, mida nimetatakse ka klõpsatavaks raamiraamiks.

Kui soovite luua nii keeruka juhtraami, vajate UXPini, mis on tööriist traatraami ja prototüüpide kujundamiseks. Interaktiivne prototüüpimine võib olla parim esitlus arenevale meeskonnale ja klientidele. Kui leidsite probleemi, et „mis juhtub, kui ma sellel nupul klõpsan?“, Peate lihtsalt klõpsama ja näitama oma klientidele, kuidas see interaktiivse prototüübiga töötab. Tõepoolest, see on üsna muljetavaldav ja otsene.

Näidake raamiraami ettevaatlikult

Kui peate oma juhtraami talle esitlema, peate olema ettevaatlik tüübi suhtes, kes on täiesti võhik. Ta võib olla teie klient, samuti võib koostööst osa võtta mittetehniline juht. Kuid ta ei tea tõde, et traatkarkass ja lõpptoode võivad tunduda seosetuna. Nii ei pruugi ta mõista nendevahelist sisemist seost ja töörežiimi. Seega peate välja mõtlema õige otsuse, kas ja kuidas peate esitlema.

See on Fernando Guilleni joonistatud rakenduse kasutaja toimingute diagramm. Muidugi on see kahtlemata varajane disainiversioon.

Traatraam on kujunduse kõige olulisem osa. Kui te seda vooskeemi nägite, saate aru, miks on nn raamiraami selgitamine ja miks me peame raamiraami kasutama. Või jätate selle sammu lihtsalt vahele.

Mis on prototüüp

Prototüübi nõue on kõrgem kui traatkarkassil / interaktiivsel raamiraamil, see peab olema suure täpsusega prototüüp, mis on interaktiivne ja sobib nii palju kui võimalik lõppkasutaja liidesega.

Prototüüpide eesmärk on üsna ilmne: simuleerida kasutaja ja liidese vahelist interaktsiooni võimalikult realistlikult. Kui nuppu vajutatakse, tuleb vastav toiming läbi viia ja vastavad lehed peavad ilmuma. Proovige toote täieliku kogemuse simuleerimiseks parimat.

Prototüübi visuaalsed omadused

Kahtlemata peab prototüüp sisaldama toote esteetilisi omadusi, millel see peaks olema, ja proovige sobitada lõppversioon. Põhimõtteliselt on see toote sisu, HTML / CSS / JS pole seotud ning serveri ja andmebaasi arvestamine pole vajalik.

Prototüübi eelis

Miks see on nii oluline? Kuna prototüüpi kasutatakse tavaliselt toodete testimiseks kasutajatele. Prototüübi testimine juba varases staadiumis võib säästa palju arenduskulusid ja aega. Nii et see ei raiskaks põhjendamatu interaktiivse liidese tõttu tagatoote arhitektuuri vaeva. Niisiis, prototüüp on täiuslik edasiminek toote testimisel disaineritele ja arendajatele.

Lisaks on prototüüpide pakkumine kasutajatele tagasiside kogumiseks - see on kasulik, kui saate ülevaate oma toote kõigist üksikasjadest ja inspireerida kogu meeskonda. Paljud prototüüpimisriistad suudavad prototüüpe kiiresti ja tõhusalt üles ehitada, kuid kodeerimist pole vaja.

Kujundusvoog

Pärast disaini olemuse tundmist ja juhtraami ning prototüübi erinevuse teada saamist seisate kasutajakasutuse disainimaailma ees.

Kui suudate konkreetsed tootedisaini seeriad sidusaks ja tõhusaks töövoogiks ühendada, juhtub imelisi asju.

Näpunäited

Raamraami tegemisel proovige kasutada redigeeritavaid ja korduvkasutatavaid elemente. Sel juhul jätkate lihtsalt elementide täpsustamist, et viia prototüübid lõpule raamide alusel.

Raamraami tegemisel proovige koguda oma meeskonna ja klientide mõtteid ja arvamusi ning kajastada neid kaadriraami kujunduses.

Kasutage oma kõige käepärasemat tööriista.

UXPin

UXPin on teile raamiraamide ja prototüüpide loomiseks ehitanud rohkem kui 900 tüüpi erinevaid kasutajaliidese elemente.

Proto.io

Proto.io on väga jõuline prototüüpimisriist ja sellega saab eksportida prototüübil põhinevat HTML / CSS-koodi ja puutetundliku ekraani interaktiivset prototüüpi, mis võimaldab kasutajatel testida tegelikes seadmetes.

Balsamiq

Populatsioon, r pikaajaline traatraami tööriist ainult staatilise raami jaoks.

Muhvid

See tööriist toetab traatkarkassi loomist otse võrgus.

Mockplus

Mockplus on kõikehõlmav prototüüpimisriist kiireks suhtlemiseks, kiireks kujundamiseks ja kiireks eelvaateks. See võimaldab luua makete mobiili (Android ja iOS), töölaua (PC ja Mac) ning veebirakenduste jaoks. Mockplus 3.0-s lisas see tõhusa meeskonna koostöö.

Axure

Kas kõige populaarsema traatraami ja prototüübi kujundamise tööriistana peame seda tööriista rohkem tutvustama? Ma arvan, et ei.

Protoshare

Selle tööriista abil saab kaabliraami ja prototüüpe teha võrgus.

InvisionApp

See tööriist aitab teil luua kasutatavat prototüüpi, te ei saa midagi joonistada, kuid saate linke erinevate ekraanide vahele lisada.

Kas soovite oma disainimõtted kirja panna .dsgnrs. ajaveeb? Loe rohkem…