TAGASI
Õppige 15 inspireeriva näite abil tundma trajektooride loomise põhialuseid. Õppige tundma kõiki trajektoori koostamise tehnikaid ja parimaid tavasid valdkonna ekspertidelt.
Veebidisainerid, tere tulemast! Olete sisenenud valdkonda, kus teie digitaalsed ideed hakkavad kuju võtma ja teie veebisait alustab oma teekonda mõttest tegelikkuseks. Kui olete kunagi soovinud salajase tööriista, mis toob selguse teie kaootilisse loomingulisse mõtlemisse, siis peaks wireframing olema teie strateegia. Alates kontseptuaalsete plaanide muutmisest käegakatsutavateks kujundusteks on trajektoorid olulised teie veebi muutmisel projekteerimisprotsess sujuv ja produktiivne. Järgnevalt sukeldume kõigesse "trajektoori" ja alustame põnevat retke 15 inspireeriva näite kaudu. näide trajektooride kohta.
Daamid ja härrad, olete valmis süvenema? Alustame! Mis on siis täpselt trajektoor? Kõige lihtsamalt öeldes on wireframe põhiline visuaalne juhend, mis kujutab endast teie veebilehe struktuuri või mobiilirakendus enne mis tahes esteetiliste elementide lisamist. See on nagu teie veebisaidi või rakenduse arhitektuurne plaan.
See sisaldab põhilisi lehe paigutusi koos peamiste komponentide, nagu pealkirjade, sisualade ja navigatsioonisüsteemide paigutajatega ning on väga sarnane skeletiga naha all või võrega kasvava viinapuu taga; iseenesest mitte päris ilus, kuid absoluutne alus millegi imelise jaoks, mis alles kujuneb. Kas nad on madala tõepärasusega trajektoor näited või kõrgresolutsiooniga renderdused - nende põhieesmärk jääb samaks: parandada kasutajakogemust, luues funktsionaalsuse paigutuse ja suhted erinevate ekraanielementide vahel juba enne kasutajaliidese disaini käivitamist.
Lisaks pelgalt ekraani paigutusele on trajektoorid siiski ka praktilised tõhususe vahendid, kuna nad soodustavad tagasiside andmise tsüklit juba varases etapis. projekteerimisprotsess sidusrühmade vahel. Need võimaldavad varakult tuvastada probleeme, nii et väärtuslikke tunde ei kulu struktuuriprobleemide lahendamiseks pärast seda, kui on juba rakendatud säravat esteetikat. Säästetud aeg on tõepoolest teenitud raha!
Püsi ümber, kui me unbox rohkem hämmastav tahke umbes selle võtmekivi kohta veebidisain-trajektooride loomise võimas, kuid peen kunst.
Wireframe'id omavad tohutut potentsiaali, et suurendada tõhusust projekt. Kuigi need kipuvad sageli tähelepanuta jääma, on trajektoorid olulised ehitusplokid, mis toidavad traat. Siin on mõned kaalukad eelised, mis tulenevad teie veebisaidi või rakenduse kujunduse trajektoori loomisest:
Arvatavasti on kõige märkimisväärsem eelis see, kuidas trajektooride kujundamine võimaldab visualiseerida struktuuri ja paigutust ilma keerulistesse üksikasjadesse takerdumata. Joonistades trajektooride näite, saate kiiresti aru, kuidas elemendid paigutatakse ja kuidas kasutajad kasutajaliidesega suhtleksid.
Hästi koostatud trajektoori näide kõrvaldab ebaselgused ja soodustab selget suhtlust sidusrühmade - nii disainerite, arendajate kui ka klientide - vahel. Trajektooride näidised tagavad, et kõigil on ühtne ettekujutus projekti funktsionaalsusest, vähendades seeläbi hilisemaid lahknevusi.
Kolmandaks sillutavad UX trajektooride näited tõhusad teed kasutatavuse probleemide testimiseks juba varakult disainitsükli alguses. Kaardistades kasutaja teekonna läbi madala tõepärasusega trajektoor näiteid, saate kindlaks teha täiustamist vajavad valdkonnad, enne kui investeerite aega ja ressursse kõrge tõepärasusega disainilahendustesse.
Kui arendajatel on võrdlusmockup, nagu trajektoor, kiirendab see nende kodeerimisprotsessi, kuna neil on täpne ülevaade sellest, mida on vaja arendada - see on oluline samm tootlikkuse suurendamise suunas, vähendades arendusfaasis üleliigseid töötunde.
Nende eeliste kasutamine ei paranda mitte ainult teie töökorraldust, vaid toob ka kaasa intuitiivsema disaini - see annab olulist lisaväärtust kliendi rahulolu näitajatele.
Kokkuvõttes, kuigi esialgu võib tekkida soov jätta see etapp pingeliste tähtaegade või piiratud eelarve tõttu vahele, tasub neid eeliseid arvesse võtta, kui hindate, kas trajektoori koostamine peaks saama teie järgmise projekti lahutamatuks osaks.
Suurepärase trajektoori loomine on fantastiline lähtepunkt iga digitaalse toode, kuid õige suurusega spetsifikatsioonid võivad selles protsessis mängida suurt rolli. Kui te süvenete trajektooride koostamise protsessi, siis siin näete, kuidas teha mõtteks suuruse suunised ja nende tähtsus hästi kavandatud trajektooride jaoks.
Ekraanimõõtude mõistmine: Ekraanisuurused peaksid peegeldama lõppkasutaja kogemust - olgu see siis mobiilseadmes või lauaarvutis. ZDNETi uuringu kohaselt, kuna 52% ülemaailmsest veebiliiklusest pärineb mobiilseadmed. Järelikult on oluline kujundada nii väiksematele kui ka suurematele ekraanidele.
Paindlik projekteerimise lähenemisviis: Tänu suurele valikule ekraani suurustele on saadaval turg, muutub paindliku kujundusmeetodi, nn "Responsive Design", kasutuselevõtt väga oluliseks. See tehnika võimaldab kujunduse paigutust loomulikult kohandada vastavalt erinevatele ekraanisuurustele, parandades üldist kasutajakogemust (UX).
Skaalumisvõime kaalutlused: Kasutajaliides peab alati meeles pidama, et see peab jääma visuaalselt meeldivaks ja funktsionaalseks kõigil platvormidel, samal ajal sujuvalt üles- või allapoole skaleerudes.
Trajektooride standardne suurus: Kujundajad kasutavad sageli standardseid mõõtmeid, et tagada järjepidevus kõigil olemasolevatel platvormidel: Mobiil - vähemalt 320x480px; tahvelarvuti - vähemalt 768x1024px; lauaarvuti - 1366x768px.
Kui teie oskused konstrueerimisel arenevad näide trajektooride kohta erinevates mõõtmetes, loovad need suunised aluse mitmekülgsete kujunduste loomiseks, mis pakuvad optimaalset esitlust sõltumata erinevatest seadmetüüpidest ja ekraani seadetest, mida publik kasutab.
Üleminek edasijõudnute terminitele nagu "madal ja kõrge tõepärasusega trajektoor näited" või avastades seotud teemasid, nagu "veebi prototüübi näide", pidage alati meeles, et täpne mõõtmete täpsus eristab väärt vormid lihtsatest visanditest.
Nende ettevaatlike suuruse parameetrite kohandamine mängib olulist rolli, kui otsustate luua veebilehe või rakenduse trajektoor - sillutades teed kiiduväärsete disainilahenduste suunas, mis ei ole mitte ainult esteetiliselt, vaid ka funktsionaalselt atraktiivsed. Nüüd minge edasi ja sepistage elegantsed raamistikud, mis on täpselt nende mõõtmistega kooskõlastatud!
Kui olete omandanud need põhitõed, navigeerimine keerulisematel alustel nagu responsive design tulevad ilma suurema vaevata, muutes "wireframe veebilehe" näiliselt vaevata ettevõtmine, mis viib eduka projektini!
Trajektoori loomine ei ole nii hirmutav, kui see esialgu võib tunduda. Selgete sammude ja sihipäraste eesmärkide abil saate luua oma veebisaidi või rakenduse jaoks tõhusa trajektoori. Allpool olen kirjeldanud viis põhietappi, mis juhatavad teid loomise kaudu. mobiilirakenduse trajektoor protsess.
Mõjuva trajektoori loomiseks alustage kristallselgetest ärieesmärkidest. Konkreetsete eesmärkide kindlaksmääramine aitab kohandada trajektoori disaini nende eesmärkide täitmiseks.
- Kas see on müügi konverteerimine?
- Kasutaja kaasamine?
- Või teabe levitamine?
Kui need eesmärgid on määratletud, juhivad need kõiki edasisi otsuseid trajektoori koostamise etapis.
Kui teie ärieesmärgid on seatud, siis määrake kindlaks veebisaidi esmane funktsioon.
Küsige endalt:
- Kas see on platvorm peamiselt e-kaubandus?
- Informatiivne blogi, mis edendab kvaliteetset sisu?
- Või ehk kogukonna suhtlemist edendav võrgustik?
Põhieesmärgi mõistmine suunab, kuidas komponendid on lehekülgedel paigutatud ja annab märku, millised elemendid peaksid olema esiplaanil teie näide trajektooride kohta.
Lihtsate trajektooride visuaalne kujutamine muutub visuaalselt nende varasemate otsuste visuaalseks esitamiseks funktsioonide ja eesmärkide kohta käegakatsutavaks kujunduseks.
Ärge muretsege veel esteetika pärast - visandite näited on pigem esialgse ajurünnaku jämedad plaanid kui lihvitud tooted.
Keskenduge sellele, kuhu paigutada võtmeelemendid nagu:
- Navigatsioonimenüü,
- Call-to-action nupud
- Sisuplokid igal lehel.
Selles etapis annab linnulennuline vaade suurema vabaduse kujunduse kiireks muutmiseks ilma tehniliste piiranguteta, mida digitaalsed visandusvahendid pakuvad.
Kui visandid stabiliseeruvad, siis kandke need suurema eraldusvõimega digitaalsesse formaati, kasutades selleks erinevaid olemasolevaid tarkvaravõimalusi (mõnda tasuta tarkvara käsitleme hiljem!).
Digitaalne disain võimaldab ruumi detailide jaoks; see annab võimaluse peenhäälestada vahed, tüpograafilised valikud, vormiväljad jne - sisuliselt kujundades üldist UX (kasutajakogemuse) suunda, mida on näha paljudes UX wireframe'i näidetes.
Selles veebiprototüübi "madala tõepärasuse" etapis on selgus tähtsam kui dekoratiivne elegants - seega keskenduge ainult funktsionaalsusele ja kujunduse korraldusele, mitte värviskeemile või graafikale.
Viimane samm hõlmab viimaste viimaste liigutuste tegemist enne oma skeleti piirjoonte ümberpaigutamist. madala tõepärasusega trajektoor näited täieõiguslikuks veebiprototüübiks.
Kaaluge, kas investeerida siin aega, et uurida erinevaid interaktiivsuse tasemeid, mille eesmärk on jäljendada reaalset kasutajakogemust - "kõrge tõepärasusega" prototüübid pakuvad realistlikke eelvaateid, mis aitavad testijatel paremini visualiseerida disaini, mis viib parema tagasiside kogunemiseni! Pärast iteratiivse täiustamise voorusid, mis põhinevad kogutud arusaamadel, voila- Nüüd on teil käes kuldsed piletid.
Wireframing on strateegiline lähenemine veebidisain. See annab disaineritele aluspõhja, millele visuaalse kujunduse kaudu tugineda. Sukeldume mõnedesse näidetesse trajektooride kohta, mis võivad inspireerida teie kujundusi.
Käsitsi joonistatud trajektoorid on traditsiooniliselt kasutusel veebisaidi planeerimise ja arendamise algfaasis. Ma usun kindlalt, et mõnikord algavad parimad ideed lihtsa pliiatsi ja paberiga... Seega ärge kartke seda kiiret ja kuluefektiivset meetodit.
Digitaalsete platvormide puhul pakuvad madala tõepärasusega (Lo-Fi) trajektoorid selget visuaalset esitust, kuid ilma keeruliste üksikasjadeta.
1. Lo-Fi digitaalsed trajektoorid keskenduvad eelkõige funktsionaalsusele, mitte esteetikale - just nii palju üksikasju, et kujundusest aru saada, kuid mitte liiga palju, et jääksite visuaalsete või brändielementide külge.
2. Need eelnõud mängivad olulist rolli võimalike disainivigade varajases etapis tuvastamisel, otsustades samal ajal üldiste voogdiagrammide või sisu paigutamise strateegiate üle, st kus tekst ja kus pildid jne.
Kõrge tõepärasus(Hi-Fi) veebisaidi juhtmestik tuleb mängu siis, kui lisame oma plaanidele rohkem sügavust - nii visuaalselt kui ka interaktiivselt.
Lõpuks, kui pöörate oma tähelepanu lõpetatud projektidele, siis tõuseb ka teie oskusteave tõhusate projekteerimismeetodite kohta dramaatiliselt ettepoole. Need tegeliku elu rakendused toovad teoreetilised teadmised praktilistesse kasutusjuhtumitesse, pakkudes seeläbi algajatele spetsialistidele tõelisi õppimisvõimalusi, eelkõige kinnistades need mõisted kindlalt mõistetavaks, edendades seeläbi kogu innovatsiooni. projekteerimisprotsessid.
1.Iga edukas projekt algab kusagilt - põhjalike juhtumiuuringute uurimine võib paljastada, kuidas algsed ideed (mis on näide trajektooride kohta) arenevad lõpptoodeteks, aidates disaineritel nagu sina ise mõista tööstuse tavasid paremini, kiirendades oluliselt oskuste omandamise määra, edendades seeläbi kiiresti mängu muutvaid võimeid.
Nii et olgu tegemist esmakordse dirigendiga, kes töötab välja oma debüüt-sümfooniat või kogenud maestros, kes otsivad värskeid inspiratsioone; need silmaringi avardavad juhtumid, mis on hoolikalt kureeritud, tagavad absoluutse kasulikkuse kogu maailmas! Aeg nüüd võtta neid vahendeid alustada luua kestev meistriteoseid kapseldades kaasahaarav kogemusi kohe!
Ja pidage alati meeles, et selguse tagamine, alustades lihtsast ja seejärel järk-järgult keerukuse taset suurendades, tagab süstemaatiliselt kestva edu kogu loomingulise tegevuse jooksul, mis tagab korrapäraselt silmapaistvaid tulemusi, nagu on tõestanud mitmed varem mainitud silmapaistvad näited, mis annavad lootustandvatele püüdlejatele volitusi keset petlikul teel, mida nad astuvad kindlalt edasi, ületades ootamatult esilekerkivad vältimatud väljakutsed!
Valdkonnas luua veenev veebisaidi trajektoor, on põhikomponendid, mida peate püüdma lisada. Nende elementide mõistmine võib oluliselt parandada teie lõpptoote funktsionaalsust ja kasutajakogemust. Uurime, millised eripärad peaksid olema esitatud teie veebisaidi trajektoor näide.
Iga trajektoori näite üks olulisi elemente on strateegiline visuaalne hierarhia. See kriitiline koostisosa aitab kasutajaid sujuvalt läbi saidi juhatada, tagades optimaalse kasutajakogemuse. Tavaliselt paigutatakse kõige olulisem sisu lehekülje kujunduse ülaossa, millele järgneb sekundaarne või täiendav teave.
Raamistik marsruutide, näiteks peamenüüde, alammenüüde ja leivakruvide jaoks tuleks samuti lisada, kui te loote veebisaidi trajektoor. Veebisaidi navigeerimine võimaldab kasutajatel hõlpsasti liikuda teie veebisaidi eri osades. Veebisaidi navigeerimise kasutatavus võib mõjutada seda, kui hästi külastajad teie veebisaidiga suhtlevad.
Teie veebisaidi trajektoor ei ole täielik ilma oluliste sisu, näiteks piltide, videote või tekstide jaoks reserveeritud paigutussalvestusteta. Need kohad võimaldavad nii disaineritel kui ka klientidel visualiseerida, kus iga element tegelikel versioonidel asuks. veebilehed praktiliselt.
Tänapäeval on ux wireframe'i näidetes oluliseks teemaks selgelt määratletud tegevusnupud, mis asuvad strateegiliselt kõigis vajalikes ristumiskohtades kogu arendatavates saitides. Tegevuskutsed võivad ulatuda lihtsatest "Loe rohkem" linkidest kuni kaasahaaravamate linkideni nagu "Registreeru kohe!".
Nende elutähtsate valdkondade tõhusal käsitlemisel; neile rõhku pannes on võimalik koostada plaane algfaasis - on võimalik luua veebiprototüüpide näiteid, mis ületavad ootusi, pakkudes suurepäraseid kogemusi navigatsiooni lihtsuse ja intuitiivsete liideste kaudu meeldiva kaasamise kaudu.
Kui alustate trajektoori projekti, on üks oluline aspekt sobiva tööriista valimine, et luua veebisaidi trajektoor. Õnneks pakuvad nii algajatele kui ka ekspertidele arvukad tasuta tarkvaravõimalused kasutajasõbralikke ja intuitiivseid kasutajaliideseid. Need lahendused sobivad ideede elluviimiseks ilma rahaliste eelinvesteeringuteta.
Adobe "XD" pakub tugevat platvormi, kus on ühes kohas disaini-, prototüüpimis- ja jagamisvõimalused. Eriti ideaalselt sobib see madala ja kõrge tõepärasusega trajektoor ja näiteid, lihtsustab see protsessi, mis võimaldab teil keskenduda pigem põhifunktsionaalsuse kui keeruliste disainidetailide jäädvustamisele.
Järgmine on "Balsamiq". Balsamiq on tuntud oma kiire trajektooride loomise võime poolest ja võimaldab kasutajatel oma ideid suhteliselt lihtsalt visandada. Sellel on drag-and-drop komponendid, mis jäljendavad käsitsi joonistatud efekti, muutes selle väga algajasõbralikuks.
Neile, kes eelistavad töötada internetis, võib "Figma" olla kasulik. Selle pilvepõhine olemus hõlbustab reaalajas koostööd kõikjal maailmas. Figma ei võimalda mitte ainult veebiprototüüpide näidiste loomist, vaid pakub ka kvaliteetseid vektorprojekte.
Lõpuks on meil "Sketch". See ainult Macidele mõeldud tööriist on pakitud eelnevalt kujundatud elementidega - tuntud kui "wireframe templates sketch". Sketch'i suur iOS-i ja Androidi UX-mallide raamatukogu lihtsustab rakenduste arendamist, tagades samal ajal disaini järjepidevuse.
Kokkuvõttes,
- Adobe XD : Ideaalne madala mudeli täpsusega trajektooride arendamiseks.
- Balsamiq : Kiire trajektooring koos käsitsi joonistatud esteetikaga
- Figma : Ideaalne valik koostöömeeskondade jaoks
- Sketch : Parim valik rakenduse arendajate seas
Iga trajektoorikomplekt eespool mainitud vahendil on eri tüüpi projektidele sobivad eripärad ja meeskond seaded. Valige targalt, lähtudes oma konkreetsetest vajadustest, ja alustage oma trajektooride loomise teekonda!
Uustulnukana valdkonnas veebidisain, võite leida end küsides, millised näited trajektooride kohta sobivad teie tasemele. Õnneks on olemas hulgaliselt algaja-sõbralikke veebisaidi trajektoor saadaval olevad mallid, mis aitavad teil oma õppimise teel juhinduda. Need eelnevalt valmistatud mallid võivad olla usaldusväärsed näited, mida saab järgida oma esialgsete trajektooride loomisel.
Et aidata teil alustada oma reisi selles põnevas maailmas, tahaksin tutvustada kolme silmapaistvat kasutajasõbralike mallide allikat:
Nende platvormide kättesaadavus rõhutab nende kasulikkust - need on praktilised õppevahendid, pakkudes samal ajal rohkelt UX wireframe'i näiteid. Kuigi need on koostatud professionaalide poolt, tagab nende loomupärane lihtsus selle, et nad on algajatele disaineritele tõhusad abivahendid.
Pea meeles: Ja need mallid hõlbustavad just seda. Kui saavutate enesekindlust ja tutvute selle praktikaga paremini, liigute järk-järgult keerukate kujunduste väljatöötamise suunas.
Ehkki need repositooriumid annavad suurepärase alguse, mängib eksperimenteerimine samuti olulist rolli oskuste arendamise osas aja jooksul. Ärge kartke kasutada neid ressursse hüppelauana ja hargneda edasi, kui olete end mugavalt tundnud - teie tulevased projektid võivad osutuda ise erakordseks trajektoorirakenduse näidiseks!
Nii et minge ja uurige neid võimalusi juba täna - on aeg luua uusi põnevaid ideid ja panna need digitaalsele paberile!
Jääge lainele, sest järgmisena sukeldume sügavamalt sellesse, kuidas veebilehe trajektoor oluliselt parandab projekteerimisprotsess.
Möödas on need ajad, mil te sukeldusite pea ees projekti ilma, et teil oleks selget teekaart. Tänapäeval on enne mis tahes veebiprojekti alustamist väga oluline kõigepealt koostada trajektoor. Võtke need arvesse näide trajektooride kohta kui teie virtuaalsed ehitusplaanid, mis aitavad teil tuvastada võimalikke takistusi ja probleeme juba enne nende tekkimist.
Trajektooringu ilu seisneb selle lihtsuses ja juurdepääsetavuses. Sõltumata sellest, kas oled kogenud proff või algaja, kes esimest korda disainimaailma sukeldub, ei ole mingit takistust, mis takistaks sind seda tehnikat proovimast. Kuna teie käsutuses on arvukalt taskukohaseid või isegi tasuta tööriistu, ei pea trajektoorse rakenduse näidiste visandamine murdma pank.
Selleks, et alustada oma trajektoori loomist:
1.Määrake oma eesmärgid: Kõik algab sellest, et mõistate, mida soovite oma veebisaidi või mobiilirakendusega saavutada.
2.Määratlege esmased funktsioonid: Otsustage, milliseid eesmärke täidavad teie saidi/rakenduse leheküljed.
3.Looge esialgu lihtne käsitsi joonistatud joonis, kasutades selleks pliiatsit ja paberit, kui see sobib teile.
4. häälestage see käsitsi joonistatud kujutis digitaalselt madala tõepärasusega tehnikate abil. 5.Seejärel täiustage seda kõrge tõepärasus versioonid, mis pakuvad üksikasjalikumaid spetsifikatsioone.
Pidage meeles, et kuigi traatraamid võivad tunduda üsna lihtsad, eriti nende väljatöötamise algstaadiumis, võivad need olla võimsad vahendid, mis aitavad tuua selgust paindlikesse kontseptsioonidesse, luues kindla aluse, millele elegantsed kujundused võivad toetuda.
Lisaks kasutage ära internetis vabalt kättesaadavaid malle - eelkõige Sketchi malle, mis on kasulikud algajatele, kes võivad tunda end algusest peale ülekoormatuna. Erinevatel platvormidel esitatud ux wireframe'i näidete jäljendamine on samuti tõhus viis selle praktika raames esitatud erinevate metoodikate mõistmiseks.
Lõpuks, hinnates seda, kui ulatuslik ja samas mitmekülgne arsenal nagu "high fidelity website wireframes" võib olla abstraktsete ideede käegakatsutavaks reaalsuseks muutmise mõttes - see peaks motiveerima mõtlevaid entusiaste näiliselt fundamentaalsete konstruktsioonide aluseks olevate kasulikkuse väärtuste osas, nagu näiteks madala tõepärasusega trajektoor näide-kaadrid. Need ehitusplokid võivad olla algelised, kuid sisendavad tähelepanuväärseid visioone mis tahes ambitsioonika ettevõtmise jaoks! Nii et ärge kõhkle; alustage visandamist nüüd - on tõepoolest viimane aeg!
Veebisaidi trajektoorid on iga digitaalse toote, olgu see siis rakendus või veebisait, kujundamisel väga oluline osa. Sellisena tunnistan, et neil, kes on selle kontseptsiooni suhtes uued, võib tekkida mitmeid küsimusi. Seetõttu uurime mõningaid sagedamini esitatavaid küsimusi, mis puudutavad veebisaidi trajektoorid.
Mõtle veebisaidi trajektoor kui teie tulevase veebiprojekti skelett. See sätestab täieliku veebilehe struktuuri ja funktsionaalsuse. maandumisleht ilma, et oleksime veel värvilahenduste, tüpograafia või kujunduse taha takerdunud. Sisuliselt on see teie saidi arhitektuuriline plaan.
Trajektoorid annavad selge ülevaate sellest, mis kuhu kuulub, enne kui alustate ressursimahukaid projekteerimis- ja arendusetappe. Selline lähenemine võib säästa nii aega kui ka eelarvet, kuna võimaldab muudatusi teha varakult ja vältida kulukaid parandusi pärast kodeerimise algust.
Trajektooride detailsus sõltub nende eesmärgist. Need ulatuvad käsitsi joonistatud visanditest, mis kujutavad põhilist paigutust ja funktsionaalsust (madal täpsus), kuni üksikasjalike digitaalsete kujutisteni, mis annavad peaaegu täpse pildi lõplikust välimusest (kõrge ja kõrge täpsus). kõrge tõepärasusega trajektoorid).
Trajektooride loomiseks on saadaval arvukalt tasuta ja tasulisi vahendeid; nende hulka kuuluvad muu hulgas Sketch, Balsamiq, InVision Studio ja Adobe XD.
Kasutajaliidese maailmas/UX disain, kolm põhimõistet tekitavad sageli segadust algajate seas: "Mockups", "Wireframes" ja "Prototüübid". Kuigi need terminid võivad tunduda ühe ja sama mündi eri külgedena, on neil erinevad funktsioonid, mis aitavad lõpptoodangule ainulaadselt kaasa.
Põhimõtteliselt on wireframe oluline kujundusjoonis, mis kujutab sarnaselt hoone arhitektuuriplaaniga lehekülje elementide, saidi funktsioonide, konversioonialade jne. asukohta ja suurust. Näited trajektooride kohta võivad ulatuda käsitsi joonistatud visanditest kuni suure täpsusega digitaalsete illustratsioonideni. Need lihtsad visandid keskenduvad peamiselt funktsionaalsusele, käitumisele ja sisu prioritiseerimisele, mitte veebilehe esteetilistele aspektidele.
Mockup läheb sammu võrra edasi, pakkudes visuaalseid detaile, värviskeeme ning esitades staatilise kõrgetasemelise vaate rakendusest või veebilehest - nagu teie tulevase veebisaidi realistlik mudel. See aitab sidusrühmadel varases etapis vaadata, kuidas lõpptoode välja näeb ja tundub, ilma et oleks vaja mingeid suhtlemisvõimalusi.
Lõpuks jõuab prototüüp - lõpptoote interaktiivne imitatsioon. Erinevalt wireframe'i näidetest, mis keskenduvad ainult kujundusele või välimusele, pakuvad prototüübid käegakatsutavat kogemust, simuleerides kasutaja interaktsioone. Nad kipuvad jäljendama tegelikku navigeerimist ja kasutajavoog rakenduste või veebilehtede ekraanide vahel klõpsatavate nuppude või linkide kaudu.
Selle arengu meelespidamine võib aidata teil paremini mõista iga kontseptsiooni unikaalset rolli tõhusa UI/UX kujundamisel. Disainiprotsess.
Et kujutada ette trajektooride rolli veebidisain, kujutagem ette maja ehitamist ilma plaanita - oleks peaaegu võimatu tagada täpsust, tõhusust ja ettenägelikkust. Samamoodi on veebisaidi loomine ilma trajektooride kasutamiseta sageli täis tarbetuid komplikatsioone ja tagasilööke.
A veebisaidi trajektoor on sisuliselt paljas skeem, mis kujutab teie veebilehe elemente, enne kui liigute edasi detailsemate aspektide, näiteks värvide või kirjatüüpide suunas. See protsess lihtsustab ja ühtlustab veebiarendus andes selgust, mis kuhu kuulub. Kuid kuidas täpselt mõjutab see teie üldist töökorraldust? Analüüsime seda päringut põhjalikumalt.
Veebisaidi trajektoorid aitab peamiselt konfigureerida teie saidi optimaalset kujundust, mis parandab oluliselt kasutajakogemust. See aitab saidi arendajatel tuvastada esmaste funktsioonide kõige intuitiivsemat paigutust, mistõttu on UX-ile tohutult kasu.
Näiteks võib strateegiliselt paigutatud üleskutse-tegevuste abil julgustada kasutajaid võtma kiiresti asjakohaseid meetmeid, kaotamata seejuures huvi. Selline ennetav korraldus võib positiivselt kajastada protsessi eri etappide, sealhulgas prototüüpimise ja kodeerimise kaudu.
Konstrueerimine mobiilne trajektoor näide võib luua harmooniat ka meeskonnaliikmete vahel, pakkudes käegakatsutavat võrdluspunkti, millest kõik saavad aru, hoolimata sellest, et neil on erinevad erialad - olgu nad siis loovdisainerid, äristrateegid või kodeerimisninjad. Nende üksuste vaheline organiseerimine muutub palju lihtsamaks, kui suunised on kehtestatud trajektooride näite abil.
Selline visuaalne esitus võimaldab igal osalejal aimata võimalikke probleeme või väljakutseid, millega nad võivad hiljem kokku puutuda, mis võimaldab paremat ettevalmistust ja seejärel vähem probleeme täitmisetappide ajal.
Trajektoorse kujunduse maailma sisenemine võib esialgu tunduda üle jõu käivana. Kuid kui teil on mõned kvaliteetsed näited, võib see muutuda põnevaks loominguliseks ettevõtmiseks. Täna tutvustan kolmkümmend sellist näidet, kus ettevõtted on illustratiivsete trajektooride abil hästi hakkama saanud.
Need juhtumid, mis toovad kaasa mitmeid eeliseid - nende hulgas on eelkõige suurem kasutatavus -, on sobivad illustratsioonid tõhusate äritegevusega seotud trajektooride kasutamise kohta.
Oletame, et teil on konsultatsioonifirma, mille eesmärk on meelitada oma saidi kaudu globaalset publikut; sellisel juhul on legendaarsete konsultatsioonihiiglaste madala tõepärasusega sukeldumine trajektoorne visand näited võivad osutuda hindamatuks. Accenture'i sujuv kasutajanavigatsiooni struktuur kujundati välja intensiivsete visandite näidete abil, mis on omamoodi teejuhiks uustulnukatele selles valdkonnas.
Selle tee jätkamine võib teid viia teiste intrigeerivate juhtumite juurde, mida tasub kaaluda: SaaS-põhised ettevõtted, mis keeravad keerulisi kontseptsioone kergesti seeditavaks sisuühikuteks, tervishoiutehnoloogia ettevõtted, mis kujundavad patsiendisõbralikke kasutajaliideseid, ja paljud teised!
Pea meeles - nagu need 30 säravat näidet näitavad -, et kõik algab visanditega paberil või digitaalsel lõuendil, enne kui need arenevad konkreetseteks tegevuskavadeks, mis on valmis teostamiseks!
Olles teadlik sellest, mis on trajektoor, selle kasulikkusest ja märkimisväärsetest näidetest, on aeg proovida oma kätt trajektoori loomisel. Tõhusa trajektoori loomise kunst seisneb selle lihtsuses ja selguses. Soovitan teil meeles pidada, et üldine eesmärk on mobiilne trajektoor ei ole mitte esteetiline atraktiivsus, vaid funktsionaalsus.
Tutvustame mõningaid peamisi samme, mida saate järgida:
Alustage projekti eesmärkide kindlaksmääramisest. Mõistke, mida te loodate sellest protsessist saada ja kuidas trajektoor aitab neid eesmärke saavutada.
Teie kujundus peaks alati olema kasutajakeskne, seega on väga oluline teada, kes on teie kasutajad ja nende vajadused. Kas nad on tehnikaga kursis või on nad algajad? See otsus mõjutab otseselt teie lõplik kujundus ja keerukus.
Tutvuge veebis kättesaadavate ux wireframe'i näidetega. Veebiplatvormidel nagu Dribbble või Behance on ulatuslikud raamatukogud näide trajektooride kohta mis annavad suurepäraseid teadmisi alustamiseks.
Nüüd tuleb lõbus osa! Võta pliiats (või pliiats) ja hakka oma ideid paberile või digitaalselt visandama, kasutades selleks valitud vahendit, näiteks Adobe XD või Figma.
Pea meeles:
- Järgige veebisaidi standardset kujundust - nii raske kui see ka ei tundu olevat, kasutajad eelistavad veebisaidi navigeerimisel tuttavlikkust loovusele.
- Loogiliste navigatsiooniteede loomine - mõelge, kuidas teie kasutajad võivad liikuda ühelt leheküljelt/lõigult teisele.
- Ärge keskenduge esteetikale - keskenduge pigem paigutusele kui värvidele, kirjatüüpidele jne.
Pärast esialgse eelnõu valmimist vaadake uuesti läbi varem uuritud materjal - veebiprototüübi näited või madala tõepärasusega trajektoor näited võivad selles etapis osutuda käepäraseks referentsiks.
Koguge võimaluse korral tagasisidet oma eelnõu kohta, see tähendab, et levitage seda kolleegide/sõprade või ideaalis potentsiaalsete kasutajate seas, kui see on kättesaadav. See aitab mõõta kasutatavust ja tõhusust, selgitades samal ajal võimalikke probleeme, enne kui liigute sügavamale disaini arendamisse.
Väljapaistva ja kasutatava trajektoori loomine nõuab harjutamist nagu iga teine käsitöö, mis kulgeb läbi erinevate versioonide, kuni jõuab ühe piisavalt võimekani, mis aitab panna aluse hilisemale muljetavaldavale arengule. Võite olla kindel, et iga loodud trajektoor muudab teid veebilehe funktsionaalsuse osas targemaks, parandades seega oma oskusi järsult, nii et jätkake!
Kasutajasõbralike veebisaitide loomine algab läbimõeldud ja tahtliku trajektooride kavandamisega - Alusta juba täna!
Estonian 
English 
German 
Swedish 
Danish 
Norwegian 
Finnish 
French 
Polish 
Arabic 
Italian 
Japanese 
Korean 
Spanish 
Dutch 
Greek