Turinys
- Reaguojanti metodika
- Kaip pirmiausia išlaikyti turinį?
- Kodėl?
- 01. Apibrėžkite savo verslo ir vartotojo tikslus
- 02. Nurodykite jiems kiekvieną galimybę
- 03. Nebijokite atstumti
- 04. Stumkite ir savo komandą
- 05. Iš anksto apibrėžkite visą turinio poreikį
- Kaip nutraukti turinį nuo pateikimo?
- Turime nustoti galvoti apie turinį dėl išdėstymo
- Priverskite savo klientus planuoti savo turinį nepriklausomai nuo dizaino
- Užbaigti turinį prieš kuriant
- Naudokite tikrą turinį - kiekvieną kartą
- Taigi, kaip vieliniai rėmai veikia reaguojant į dizaino projektus?
- Eskizas
- Naršyklės sistemoje
- Anotacijos
- Naudokite tikrą turinį laidų rėmuose
- Kaip pirmiausia kurti mažiems ekranams?
- Abstraktūs dizainai iš prietaisų pradžioje
- Naudokite stiliaus plyteles
- Sukurkite sąsajos harmoniją
- Peržiūrėkite viską naršyklėje
- Siekite pusiausvyros su statinėmis programomis
- Išvada
Aiškiai pasakykime: dizainas yra sprendimas tik tuo atveju, jei jis sutelkia dėmesį į gilesnes problemas, kodėl viskas slypi. Tvirtas procesas visada turėtų būti mūsų darbo vadovas, tačiau turime priimti kažką lankstesnio. Mūsų terpė pagaliau pasirodė esanti sklandi, tad argi ne mūsų procesas? Pagalvokite apie sistemos dizainą: turite pamatyti ir visą vaizdą, ir smulkias detales. Neįmanomas? Toli nuo to!
Frankas Chimero tai gražiai išsako knygoje „Dizaino forma“: „Yra dalis, kur menininkas atsitraukia nuo molberto, kad įgytų naują kūrinio perspektyvą. Tapyba yra lygiomis dalimis šalia ir toli: artėdamas artistas sunkiai dirba, kad padarytų savo žymę; kai toli, jis vertina kūrinį, kad galėtų išanalizuoti jo savybes. Jis atsitraukia, kad darbas su juo kalbėtų “.
Turime leisti, kad mūsų darbas, terpė kalbėtų su mumis. Didėjant reaguojančiam dizainui, mes pagaliau pritariame savo terpei, kokia ji turėjo būti: skysta. Tai puikus laikas atsitraukti ir įvertinti darbą, išanalizuoti ir priimti naują dalykų atlikimo būdą, naują procesą. Praėjo statinių maketų ir interneto dizainerių, kurie nesupranta kodo, laikai. Atėjo laikas reaguoti į procesą.
Reaguojanti metodika
Šio straipsnio pradžioje atiduosime didžiąją tvirto proceso paslaptį. Nes mes tokie pamišę. Paruošta? Reaguojantis procesas yra atsakingas procesas. Neaišku? Gal būt. Kvailas? Ne. Kaip ir žiniatinklio standartų judėjimas prieš jį, interaktyvus dizainas stumia internetą į priekį naudodamas ateities perspektyvas.
Kaip ir bet kuris projektavimo procesas, jis turėtų sutelkti dėmesį į priežastis, kodėl visa tai slypi. Taigi kodėl egzistuoja internetinės svetainės? Pateikti turinį. Tai gali būti pagrįsta užduotimis, socialine, informacine informacija ... nesvarbu. Viskas priklauso nuo to: pradėkite nuo priežasties, gerai suformuoto turinio ir svarbių sąveikų.
Čia yra klausimai, kuriuos dažniausiai girdime apie mūsų reaguojamą projektavimo procesą.
Kaip pirmiausia išlaikyti turinį?
Mes visi esame tokie optimistiški projekto pradžioje. „Pirmiausia turinys!“ sakome. „Vartotojo tikslai! Prisimink, kas svarbu! “ Tai tiesa. Bet ką tai reiškia? Kaip jūs įgyvendinate turinio procesą?
Net jei žinote (arba manote, kad žinote), tai lengva pamiršti, kai projektas vyksta. Ilgalaikiai projektai turi tendenciją tęsti ir tęsti (ir tęsti… ir toliau ...). Mes nustojame galvoti apie kodėl ir pradedame sutelkti dėmesį į tai, kaip. Apgauname save galvodami, kad mūsų projektus galima suskirstyti į atskirus „atradimo“ ir „kūrimo“ etapus, kurie gali egzistuoti savarankiškai.
Tiesa, mes turime nuolat klausinėti kodėl. Nesvarbu, kiek manote, kad žinote, kad ir kiek planavote - kiekvieną kartą, kai priimate sprendimą, kiekvieną kartą, kai suprojektuojate mygtuką ar parašote antraštę, turite paklausti ...
Kodėl?
Kodėl aš tai darau? Kam jis skirtas? Kokį verslo tikslą jis padės pasiekti mano klientui? Ko reikia, kad mano vartotojai galėtų tai spręsti? Pirmiausia turėkite ne tik turinį. Pirmiausia laikykite kodėl.
Tai leidžia lengvai skambėti. Bet norint tai padaryti gerai, teks stumti. Pabandykite savo klientus ir komandą pirmiausia apibrėžti jų priežastis. Nėra „Lorem Ipsum“, nėra „mes prie to prieisime vėliau“. Atlikite namų darbus! Visas jūsų mintis reikia pradėti nuo tvirto kodėl. „Geltoname pieštuke“ tai reiškė didelius pokyčius, kaip mes rengiame projektus, planuojame, planuojame biudžetą ir planuojame projektus. Turėjome reikalauti biudžeto ir laiko, kad atliktume patikimus tyrimus, strategiją ir planavimą. Jūs taip pat galite. Bet kai jūsų klientai ir jūsų komandos pamatys milžinišką turinio poreikių apibrėžimo naudą, jie niekada neatsigręš.
Ir mūsų darbas juos ugdyti. (Perskaitykite puikią Mike'o Monteiro knygą „Dizainas yra darbas“, jei norite sužinoti daugiau apie bendravimą su klientais.) Klientams gali būti sunku suprasti visų šių tyrimų atlikimo vertę ir dirbti iš anksto. Ir kodėl jie turėtų? Jie negauna nieko „baigto“ pabaigoje - ir pernelyg dažnai jie tiesiog gauna sąskaitą faktūrą ir didelį „Word“ dokumentą.
Tai ne jų kaltė - tai mūsų kaltė. Mūsų pareiga yra geriau atlikti tą vertę. Kiekviename žingsnyje turime viską sugrąžinti į svarbiausią priežastį.
Tai ypač svarbu reaguojant į dizainą. Reaguojanti svetainė nereikalauja daug didesnių pastangų kuriant, tačiau tai reiškia daug daugiau planavimo. Tikrai, tai yra planavimas, kurį turėjome daryti visą laiką. Stebėkite dabartinį kas ketverius trejus metus trunkantį projektavimo ciklą. Ar norite toliau tai daryti? Mes tikrai ne.
Taigi čia yra trys žingsniai, kad turinys pirmiausia išliktų jūsų projekto procese.
01. Apibrėžkite savo verslo ir vartotojo tikslus
Sudarykite prioritetinį savo verslo verslo ir vartotojų tikslų sąrašą. Ką labiausiai nori žinoti ar padaryti jūsų vartotojai? Atlikite tyrimus. Padarykite pagrįstų išvadų, o ne laukinių spėjimų. Priverskite visas suinteresuotąsias šalis susitarti.
02. Nurodykite jiems kiekvieną galimybę
Kiekvieną kartą, kai priimate sprendimą, kiekvieną kartą, kai kas nors pasiūlo naują funkciją, dizaino elementą ar turinio puslapį, paskatinkite juos susieti užklausą su verslo ir vartotojo tikslu. Kokį realų poreikį tenkins ši funkcija? Kokia tikroji priežastis? (Užuomina: „Nes aš noriu“, „Man labai patinka mėlyna spalva“ arba „Visi yra„ Facebook “).
03. Nebijokite atstumti
Tai gali būti nelengva. Santykiai su klientais gali būti subtilūs, ir gali būti viliojanti atsisakyti kovos siekiant laimėti karą. Bet atminkite, kad mes visi kartu esame! Tai nėra verslas prieš vartotoją; mus ir juos.
Vartotojų poreikių tenkinimas yra geriausias būdas patenkinti verslo poreikius. Nes be savo vartotojų mes neturime verslo! Klientai (geri klientai) nesamdo jūsų pasakyti viskam „taip“. Taigi, jei jūsų klientas prašo ko nors, kas neatitiks jo tikslų ar vartotojų poreikių, nebijokite jų mesti. Tai ne apie ego. Tai yra sukurti geriausią įmanomą sprendimą.
04. Stumkite ir savo komandą
Tai taip pat gali būti iššūkis dirbant kūrybinėje komandoje. Vaidmenų - vizualinio dizaino, vartotojo patirties, informacijos architektūros, turinio strategijos, turinio kūrimo - atskyrimas gali sukelti nesusikalbėjimą. Mes užsiimame, mus užvaldo el. Laiškai. Sunku išlikti su projektu nuo pradžios iki galo, ypač atlikus „tavo“ darbą.
Jūsų komandos santykiai yra bent jau tokie pat svarbūs kaip jūsų santykiai su klientais. Mes turime priminti sau, kodėl, kaip ir klientai. Bendradarbiavimas yra pagrindinis dalykas. Negalite tiesiog „atiduoti“ turinio plano, vielinių rėmų ar dizaino. Kiek įmanoma, turime dirbti ranka rankon. Lengva „užbaigti“ pristatymą ir pereiti prie kažko kito. Daug sunkiau likti su projektu, kai eina sunkiau.
Krioklio požiūris į kūrybinį darbą tiesiog neveikia. Vikrus, bendradarbiaujantis komandos narių darbas padeda pasiekti geresnių rezultatų.
05. Iš anksto apibrėžkite visą turinio poreikį
Štai toks dalykas: reaguojančių svetainių planavimas užtrunka ilgiau. Nebeplanuojame tik vieno konteksto. Mes planuojame visus kontekstus, apie kuriuos dabar žinome, ir kai kuriuos, kurių dar nėra.
Bet užtrunka daug mažiau laiko, norint suplanuoti visus tuos sudėtingumus iš anksto, nei grįžti atgal ir pertvarkyti funkcijas ir funkcijas, kurių neatsižvelgėte. Taigi praleiskite laiką / pastangas / biudžetą. Priverskite savo klientus ir komandą apibrėžti (ir įsipareigoti!) Visą savo turinį, prieš pradėdami kurti dizainą. Naudokite puslapių lenteles. Naudokite struktūrinį turinį. Apsaugokite savo turinį dabar! Arba verkti vėliau.
Kaip nutraukti turinį nuo pateikimo?
Tai daug girdi aplink internetą. Bet palaukit, kas? Ir palauk - kodėl?
Nes pristatymas gali (ir keisis). Mūsų svetainių kūrimo būdas prieš 15 metų beveik neatpažįstamas nuo to, kaip jas dabar pristatome. Bet žinote, kas nepasikeitė? Žodžiai. Mes vis dar naudojame juos. Internetas pirmiausia skirtas (teksto) turiniui. Mes jį vis dar naudojame informacijos problemoms spręsti; atlikti užduotis. Bet jei jūsų turinys priklauso nuo pateikimo priemonės („Flash“ įvadiniai puslapiai, kas nors?), Yra tikimybė, kad jis nebus naudojamas po kelerių metų. Ir tai čiulpia.
Turime nustoti galvoti apie turinį dėl išdėstymo
Mes (kaip pramonė) mokėme savo klientus galvoti apie turinį išdėstymo požiūriu. "Įdėkite jį į šoninę juostą", - sakome mes. "Tai turėtų eiti poraštėje". Sustabdyti! Sustabdyk. Sustabdyti. Tai ne apie vietą. Tai apie prioritetą. Koks yra svarbiausias turinys jūsų vartotojams? Nes atspėk ką: išdėstymas keičiasi kontekstuose. Jūsų mažo ekrano dizainas (tikriausiai) nebus šoninė juosta.
Milžiniškas supermeniu, kurio nori jūsų klientas? Neskris su „iPhone“.
Priverskite savo klientus planuoti savo turinį nepriklausomai nuo dizaino
Gerai, nereikia jų priversti. Padrąsinkite juos. Labai skatina. Tam puikiai tinka puslapių lentelės. Jei dar neskaitėte, nedelsdami pereikite prie Kristinos Halvorson ir Melissa Rach žiniatinklio turinio strategijos, kur rasite daugiau informacijos, kaip juos sukurti. Organizuokite juos prioritetine tvarka. Nenurodykite vietos ar išdėstymo. Tai padės jūsų klientams produktyviau galvoti apie savo turinį ir taip pat paskatins turinio kūrimo procesą prieš baigiant vielinius rėmus ar dizainą.
Užbaigti turinį prieš kuriant
Gerai, tai ne visada įmanoma. Bet kuo daugiau netikrumo galite pašalinti prieš pradėdami kurti, tuo mažiau turėsite grįžti ir vėliau viską pakeisti.
Naudokite tikrą turinį - kiekvieną kartą
Jei įmanoma, naudokite didžiųjų raidžių turinį - parodykite savo klientams sudėtingiausius puslapius, vaizdus ir meniu. Tai padės išvengti netikėtumų vėliau, kai jie matys savo kukliausią kiekį gatavame produkte.
Funkcionalūs naršyklės vieliniai rėmai daro skirtingą pasaulį. Leiskite savo klientams stebėti, kaip jų turinys juda ir keičiasi įvairaus dydžio ekranuose. Nurodykite tai, kai pateikiate laidinius rėmus (jūs rengiate pristatymus asmeniškai, tiesa?) Parodykite jiems, kaip jų informacijos prioritetas išlieka toks pats, kai ekrano dydis keičiasi, kai keičiasi išdėstymas.
Taigi, kaip vieliniai rėmai veikia reaguojant į dizaino projektus?
Mes esame įsitikinę, kad RWD sąveikos dizainas turi greitai ir dažnai patekti į naršyklę. Gana neįmanoma sukurti statinio dokumento, kuriame būtų viskas aprašyta. Žinoma, mes galėtume sukurti dokumentą, kuriame būtų parodyti trys, keturi ar penki lūžiai, tačiau tai tik dalis istorijos. Ką apie visas akimirkas tarp lūžio taškų? Tai atsitinka naršyklėje.
Eskizas
Vis dėlto gerai, kad pavyksta greitai nubrėžti savo idėjas bendradarbiaujant. Tai neturi atsitikti jokioje konkrečioje terpėje, tačiau pieštukas ant popieriaus yra kažkas. Čia esmė - greitai ir kartotinai pasisemti idėjų. Mes mėgstame šabloną, kai tik įmanoma, ir tam yra net programa: „UI Sketcher“.
Naršyklės sistemoje
Štai tikrasis bilietas mums. Mes mėgstame pakartotinai naudoti modelius ir sistemas, kai naršyklėje demonstruojame RWD. Žinoma, kiekvieną kartą galėtume sukurti savo sistemą nuo nulio, tačiau tai nepadeda nei mums, nei mūsų klientams.
Mes taip pat mėgstame naudoti greito reagavimo prototipų sistemas, tokias kaip „Twitter's Bootstrap“ ar „Zurb's Foundation“. Mes asmeniškai linkome į fondą, nes jis tinka mūsų darbo eigai. Būtų puiku, jei kuris nors iš jų pasirinktų mažo ekrano, mažo pralaidumo pirmąjį metodą, bet mes taip tik sukamės.
Anotacijos
RWD laidų rėmelių anotacijos yra būtinos, tačiau, mūsų manymu, dažnai jų nepaisoma. Pasakykite tai garsiai: dokumentacija, dokumentacija, dokumentacija! Mes matėme keletą to pavyzdžių iš draugų ir manome, kad žiuri vis dar yra „geriausias“ būdas tinkamai anotuoti naršyklėje reaguojančius laidus. Kaip minėta pirmiau, mes reguliariai naudojame „Foundation by Zurb“ ir norėtume naudoti savo „Reveal“ priedą savo anotacijoms rodyti. Šios anotacijos rodomos tik didesniuose ekranuose ir idealiu atveju jas galima įjungti ir išjungti.
Naudokite tikrą turinį laidų rėmuose
Aplink „Lorem Ipsum“ kilo daug diskusijų dėl laidų rėmų ir dizaino maketų, tačiau jei savo laidų rėmuose nėra tikro turinio, tai darote neteisingai. Turinys informuoja apie sąveikos sprendimus ir nurodo, kada dizainas sulaužys. Kaip tai gali padaryti Loremas Ipsumas?
Kaip pirmiausia kurti mažiems ekranams?
Daugelį metų kūrėme atsižvelgdami į konkrečią rezoliuciją. Tai buvo numatytasis nustatymas. Nesvarbu, ar eskizai sąsiuviniuose, ar laidų rėmeliai „OmniGraffle“, ar darbai „Photoshop“, ar projektavimas naršyklėje, žinojome, koks bus mūsų drobės dydis. Tos dienos nebėra. Mes labai tikintys, kad pirmiausia kuriame mažą ekraną ir palaipsniui tobuliname. Taigi, kaip dizaineris keičia savo darbo eigą iš fiksuoto drobės dydžio į sklandų?
Abstraktūs dizainai iš prietaisų pradžioje
Nebent mes projektuojame konkretų įrenginį, labai svarbu nustoti galvoti apie prietaisus ir pradėti galvoti apie patirtį. Visi šie metodai padeda dizaineriams kurti savo patirtį, tuo pačiu išlaikant agnostiką (iki taško).
Naudokite stiliaus plyteles
Norėdami nustatyti kryptį ir greitai kartoti, naudokite stiliaus plyteles. „Stiliaus plytelės“ suteikia dizaineriui galimybę apibrėžti dizaino sistemos kryptį pernelyg nesuprantant. Jų kūrėja Samantha Warren juos apibūdina taip:
„Stiliaus plytelės yra skirtos, kai„ moodboard “yra per daug neaiški, o kompas - per pažodinis. „Stiliaus plytelės“ nustato tiesioginį ryšį su tikraisiais sąsajos elementais, neapibrėžiant išdėstymo “
Sukurkite sąsajos harmoniją
Įsivaizduokite drobę su visais vaizdiniais ir interaktyviais elementais. Ne tam, kad pamatytumėte konkretų vartotojo sąsajos išdėstymą, bet norėdami pamatyti, kaip visi elementai veikia kartu. Tai sąsajos harmonijos drobė. Sąsajos harmonijos drobė leidžia dizaineriui išlaikyti idėjas kartu, bet nesusitelkiant į vieno ekrano dydį. Be to, tai puikus būdas efektyviai bendrauti ir dokumentuoti suprojektuotus elementus, o ne sukurti visą stiliaus vadovą.
Jei jus domina toliau skaityti, du puikius straipsnius sąsajos harmonijos tema rasite čia ir čia.
Peržiūrėkite viską naršyklėje
Naršyklėje reikia sujungti viską. Čia iš tikrųjų atgyja vartotojo sąsajos dizainas. Labai svarbu pamatyti, kaip tikrasis turinys sąveikauja su vaizdiniais elementais. Statiškoje aplinkoje to padaryti negalima tinkamai. Jūs turite pamatyti, kaip tai reaguos į gimtąją terpę.
Siekite pusiausvyros su statinėmis programomis
Tarp naršyklės ir statinių programų, tokių kaip „Photoshop“, vyksta srautas. Turėtų būti pusiausvyra, leidžianti sukurti projektavimo sistemą sklandžiai ir natūraliai. Žinoma, tai įvyks „Photoshop“, tačiau reaguojantis dizaineris turi išmokti kūrybiškai mąstyti ir naršyklėje.
Išvada
Dar kartą su jausmu: pradėkite nuo kodėl, nuo gerai suformuoto turinio ir svarbios sąveikos. Pirmiausia sutelkite dėmesį į mažą ekraną ir mažą pralaidumą ir palaipsniui tobulinkite savo reaguojančias koncepcijas. Mūsų terpė sulaukia pilnametystės. Mes turime galimybę viską padaryti tinkamai ir pakeisti pasaulį, po vieną interneto projektą.
Atraskite 20 geriausių dizainerių sukurtų vielos karkaso įrankių
Steve'as Fisheris koordinuoja tyrimus, analizę, dizainą ir strategiją „Yellow Pencil“ Kanadoje ir kalba tokiomis temomis kaip RWD, UX ir atvirojo kodo. Alaine Mackenzie yra „Yellow Pencil“ turinio strategė.
