„Wireframe“ įrankiai padeda sukurti svetainės ar programos planą. Jie yra puikus būdas nustatyti svetainės ar programos funkcionalumą ir gauti atsiliepimų iš suinteresuotųjų šalių anksti kūrimo proceso metu. Šiame įraše parodysime, kaip naudoti karkaso įrankius aukštos kokybės prototipams kurti.
Vartotojo patirties dizainas yra labai svarbus bet kurio skaitmeninio produkto sėkmei. Vielinis rėmas yra paprastas vaizdinis vadovas, padedantis dizaineriams nustatyti vartotojo sąsajos struktūrą ir išdėstymą. Šiame tinklaraščio įraše parodysime, kaip naudoti karkaso įrankius kuriant efektyvius UX dizainus.
Turinys
Kas yra Vielinis rėmas?
Vielinis rėmas yra žemo tikslumo vartotojo sąsajos eskizas. Tai vaizdinis vadovas, padedantis dizaineriams nustatyti vartotojo sąsajos struktūrą ir išdėstymą.
Vieliniai rėmeliai dažniausiai kuriami naudojant paprastas formas ir linijas, juose nėra jokių spalvų ar prekės ženklo elementų. Dėl to jie skiriasi nuo didelio tikslumo prototipų, kurie yra išsamesni ir artimesni galutiniam produktui.
Vieliniai rėmeliai gali būti naudojami svetainėms, programoms ar kitiems skaitmeniniams produktams. Jie padeda dizaineriams perduoti savo idėjas suinteresuotosioms šalims ir gauti grįžtamąjį ryšį ankstyvame projektavimo procese. Vieliniai rėmeliai taip pat naudingi planuojant produkto turinį ir funkcionalumą prieš investuojant laiką ir išteklius į aukštesnio tikslumo prototipų kūrimą.
Kodėl verta naudoti „Wireframe“ įrankius?
Vielinio rėmo įrankiai turi daug pranašumų, palyginti su tradiciniais metodais, tokiais kaip pieštukas ir popierius.
- Jie padeda apibrėžti svetainės ar programos struktūrą prieš investuojant laiką ir išteklius į vizualinį dizainą. Tai leidžia atlikti pakeitimus proceso pradžioje, nepatiriant didelių išlaidų ar pastangų.
2. Jie verčia jus galvoti apie vartotojo patirtį proceso pradžioje. Ką vartotojai turi daryti šiame puslapyje? Kokios informacijos jiems reikia? Kaip jie pereis iš vieno puslapio į kitą? Iš anksto apgalvoję šiuos dalykus, vėliau galėsite išvengti didelių pakeitimų.
3. Jie suteikia bendrą kalbą dizaineriams, kūrėjams, suinteresuotoms šalims ir klientams perduoti savo idėjas. Kadangi jie sutelkia dėmesį į funkcionalumą, o ne į formą, vėliau gali padėti sumažinti nesutarimus dėl projekto krypties.
4. Juos lengva pakeisti ir kartoti. Skirtingai nuo didelio tikslumo vizualinio dizaino, kurio pakeitimas gali užtrukti valandas ar net dienas, vielos rėmus galima pakeisti greitai ir lengvai.
Kaip naudoti „Wireframe“ įrankius?
Dabar, kai atsakėme į klausimą „kas yra vielinis rėmas? Pažiūrėkime, kaip naudoti „wireframe“ įrankius kuriant efektyvius UX dizainus.
Procesą sudaro trys žingsniai: pirma, turėsite pasirinkti rėminimo įrankį; antra, turėsite sukurti savo vielinius rėmus; ir trečia, norėdami gauti atsiliepimų, turėsite pasidalyti savo rėmeliais su suinteresuotosiomis šalimis.
Pažvelkime į kiekvieną žingsnį atidžiau.
1 veiksmas: pasirinkite „Wireframing Tool“.
Yra daugybė įvairūs vielinio rėmo įrankiai šiandien yra rinkoje, todėl gali būti sunku išsirinkti tą, kuris atitiktų jūsų poreikius. Siekdami susiaurinti parinktis, toliau sudarėme mėgstamiausių rėminimo įrankių sąrašą:
- AdobeXD: „Adobe XD“ yra galingas vektoriniu pagrindu sukurtas projektavimo įrankis, puikiai tinkantis kurti aukštos kokybės prototipus. Ji siūlo intuityvią sąsają ir daugybę funkcijų, kurios supaprastina jūsų darbo eigą. Be to, jis integruojamas su kitomis „Adobe Creative Cloud“ programomis, tokiomis kaip „Photoshop“ ir „Illustrator“, todėl jūsų dizainą lengva nušlifuoti.
- „InVision Studio“: „InVision Studio“ yra dar viena puiki galimybė kurti aukštos kokybės prototipus. Kaip ir „Adobe XD“, ji siūlo intuityvią sąsają ir galingas funkcijas, kurios supaprastina jūsų darbo eigą. Tačiau „InVision Studio“ išskiria paprastas naudojimas – ji sukurta specialiai žmonėms, kurie nėra susipažinę su projektavimo įrankių, pvz., „Photoshop“ ar „Sketch“, naudojimo.
- Balsamiq maketai: „Balsamiq Mockups“ yra prieinamas rėminimo įrankis, puikiai tinkantis žemo tikslumo eskizams kurti. Ji siūlo lengvai naudojamą nuvilkimo sąsają ir integruotų komponentų biblioteką.
2 veiksmas: sukurkite savo vielos rėmus
Pasirinkę vielinio rėmelio įrankį, laikas pradėti kurti rėmelius.
Geriausias būdas atlikti šį veiksmą yra suskaidyti projektą į mažesnes užduotis. Pavyzdžiui, jei kuriate el. prekybos svetainę, galite pradėti nuo pagrindinio puslapio eskizų, tada pereiti prie produkto puslapio, pirkinių krepšelio puslapio ir pan.
Tai padės išlikti organizuotiems ir neapsunkinsite projekto apimties.
3 veiksmas: pasidalykite savo vielos rėmeliais su suinteresuotosiomis šalimis
Sukūrę vielinius rėmus, laikas pasidalyti jais su suinteresuotosiomis šalimis, kad gautumėte atsiliepimų. Geriausias būdas tai padaryti yra naudojant internetinį bendradarbiavimo įrankį, pvz., InVision arba Justinmind.
Šie įrankiai leidžia įkelti savo vielinius rėmelius ir pakviesti kitus peržiūrėti juos internete. Jie taip pat leidžia suinteresuotosioms šalims tiesiogiai komentuoti dizainą, todėl galėsite lengvai įtraukti jų atsiliepimus į būsimas iteracijas.
