Садржај
- Методологија која одговара
- Како прво задржати садржај?
- Зашто?
- 01. Дефинишите своје пословне и корисничке циљеве
- 02. Упути их на сваку прилику
- 03. Не плашите се да се вратите уназад
- 04. Погурајте и свој тим
- 05. Дефинишите све своје потребе за садржајем унапред
- Како да апстрахујем садржај из презентације?
- Морамо престати да размишљамо о садржају у смислу изгледа
- Присилите своје клијенте да планирају свој садржај независно од дизајна
- Довршите свој садржај пре дизајнирања
- Користите прави садржај - сваки пут
- Па како жичани оквири раде за респонзивне дизајнерске пројекте?
- Скицирање
- Оквир у прегледачу
- Биљешке
- Користите прави садржај у жичаним оквирима
- Како прво да дизајнирам за мале екране?
- Апстрактни дизајн са уређаја на почетку
- Користите плочице за стил
- Створите хармонију интерфејса
- Погледајте све у прегледачу
- Нађите равнотежу са статичким програмима
- Закључак
Разјаснимо: дизајн је решење само ако се фокусира на дубља питања која су у питању и зашто све стоји иза свега. Чврст процес увек треба да нас води, али морамо прихватити нешто флексибилније. Наш медијум се коначно показао флуидним, па зар и наш процес не би требало? Размислите о дизајну система: морате видети и целу слику и ситне детаље. Немогуће? Далеко од тога!
Франк Цхимеро то лепо описује у својој књизи Облик дизајна: „Постоји део када се уметник одмакне од штафелаја да би стекао нову перспективу дела. Сликање је једнак део изблиза и из далека: када је близу, уметник вредно ради да би оставио печат; када је далеко, он процењује дело како би анализирао његове квалитете. Поступа уназад да пусти да му посао говори “.
Морамо пустити да наш рад, наш медиј, разговарају са нама. Са порастом респонзивног дизајна, коначно прихватамо наш медиј какав је требало да буде: флуидан. Сјајно је време за корак уназад и процену рада, анализу и прихватање новог начина рада, новог процеса. Прошла су времена статичних макета и веб дизајнера који не разумеју код. Време је за одговарајући процес.
Методологија која одговара
Одаћемо велику тајну чврстог процеса одмах на почетку овог чланка. Јер смо такви луди. Спремни? Реагујући процес је одговоран процес. Нејасно? Можда. Блесаво? Не. Као и кретање веб стандарда пре њега, и респонзивни дизајн гура мрежу напред помоћу будућих метода.
Као и сваки поступак дизајнирања, и он би се требао усредсредити на питање „зашто“ иза свега. Па зашто постоје веб странице? Да испоручи садржај. То би могло бити засновано на задацима, социјално, информативно ... нема везе. Све се своди на ово: започните с разлозима зашто, добро структурираним садржајем и интеракцијама.
Ево питања која најчешће чујемо о нашем реактивном процесу дизајнирања.
Како прво задржати садржај?
Сви смо тако оптимистични на почетку пројекта. „Прво садржај!“ кажемо. „Кориснички циљеви! Запамтите шта је важно! “ Истина је. Али шта то значи? Како имплементирате поступак који је најважнији за садржај?
Чак и ако знате (или мислите да знате), лако је заборавити како пројекат напредује. Дугорочни пројекти имају тенденцију да се одуговлаче (и даље ... и даље ...). Престајемо да размишљамо о томе зашто, и почињемо да се фокусирамо на то како. Заваравамо се мислећи да се наши пројекти могу поделити у одвојене фазе „открића“ и „развоја“ које могу постојати независно.
Истина је, морамо стално да питамо зашто, све време. Без обзира колико мислите да знате, без обзира колико планирали - сваки пут када донесете одлуку, сваки пут када дизајнирате дугме или напишете наслов, морате да питате ...
Зашто?
Зашто ово радим? Ко је за? Који ће пословни циљ помоћи мом клијенту да постигне? Каква ће помоћ помоћи мојим корисницима? Немојте само прво задржати садржај. Прво задржите зашто.
Због тога звучи лако. Али да бисте то добро урадили, мораћете да притиснете. Присилите своје клијенте и свој тим да прво дефинишу зашто. Нема Лорем Ипсум, нема ‘доћи ћемо до тога касније’. Уради свој домаћи задатак! Све ваше потребе морају започети са чврстим разлогом. За Жуту оловку то је значило велике промене у начину на који планирамо, процењујемо, планирамо и планирамо пројекте. Морали смо издвојити буџет и време за солидно истраживање, стратегију и планирање. Можда и ти. Али када ваши клијенти и тимови виде огромне предности дефинисања потреба за садржајем унапред, више се неће освртати.
А наш посао је да их образујемо. (Прочитајте изврсну књигу Микеа Монтеира Дизајн је посао ако желите да сазнате више о општем раду са клијентима.) Клијенти тешко могу да разумеју вредност обављања свих тих истраживања и унапред припремљених радова. А зашто би? На крају не добију ништа ’завршено’ - а пречесто добијају само фактуру и велики стари Вордов документ.
То није њихова кривица - ми смо криви. Наша је одговорност да учинимо бољи посао демонстрирањем те вредности. На сваком кораку морамо све то вратити на најважније зашто.
Ово је посебно важно за респонзиван дизајн. Одзивна веб локација не захтева много више напора у развоју, али значи много више планирања. Заправо, планирамо да смо то требали радити све време. Будите сведоци тренутног циклуса редизајна сваке три године. Да ли желите да наставите то да радите? Сигурно не.
Дакле, ево три корака како задржати садржај на првом месту у процесу пројекта.
01. Дефинишите своје пословне и корисничке циљеве
Успоставите приоритетну листу пословних и корисничких циљева за свој пројекат. Шта ваши корисници највише желе да знају или раде? Истражите. Направите информисане закључке, а не дивље нагађања. Нека се све ваше заинтересоване стране сложе.
02. Упути их на сваку прилику
Сваки пут када донесете одлуку, сваки пут када неко предложи нову функцију или елемент дизајна или страницу садржаја, натерајте их да мапирају захтев у пословни и кориснички циљ. Које ће стварне потребе ова функција испунити? Који је прави разлог? (Савет: „Зато што желим“ или „стварно волим плаво“ или „сви су на Фејсбуку“ не рачунају се.)
03. Не плашите се да се вратите уназад
Ово може бити тешко. Односи са клијентима могу бити деликатни и може бити примамљиво одустати од битке за победу у рату. Али запамтите, сви смо у овоме заједно! Није посао у односу на корисника; нас против њих.
Задовољавање потреба корисника је најбољи начин да се задовоље пословне потребе. Јер без наших корисника немамо посао! Клијенти (добри клијенти) вас не ангажују да бисте на све рекли „да“. Дакле, ако ваш клијент затражи нешто што неће испунити његове циљеве или потребе корисника, немојте се плашити да га изазовете. Није ствар у егу. Ради се о стварању најбољег могућег решења.
04. Погурајте и свој тим
Ово такође може бити изазов када радите у креативном тиму. Раздвајање улога - визуелни дизајн, корисничко искуство, архитектура информација, стратегија садржаја, производња садржаја - може довести до погрешне комуникације. Постанемо заузети, затрпани смо мејловима. Тешко је остати са пројектом од почетка до краја, посебно када се заврши „ваш“ посао.
Однос вашег тима је најмање толико важан колико и ваш однос са клијентом. Морамо се подсетити зашто, баш као што то чинимо и својим клијентима. Сарадња је кључна. Не можете једноставно да „предате“ план садржаја, жичане оквире или дизајне. Што је више могуће, морамо радити руку под руку. Лако је „завршити“ испоруку и прећи на нешто друго. Много је теже остати са пројектом када потешкоће постану тешке.
Водопадни приступ креативном раду једноставно не иде. Агилни, заједнички рад чланова тима даје боље резултате.
05. Дефинишите све своје потребе за садржајем унапред
Ево у чему је ствар: прилагодљивим веб локацијама треба више времена за планирање. Више не планирамо само један контекст. Планирамо за све контексте за које сада знамо и за неке који још увек не постоје.
Али потребно је много мање времена да бисте унапред планирали све те сложености, него што је потребно за повратак и накнадну уградњу функција и функција које нисте узели у обзир. Зато потрошите време / труд / буџет. Присилите клијенте и тим да дефинишу (и обавежу се) сав њихов садржај пре него што се упустите у дизајн. Користите табеле страница. Користите структурирани садржај. Заштитите свој садржај одмах! Или плачи касније.
Како да апстрахујем садржај из презентације?
Ово често чујете око интернет-о-сфере. Али чекај, шта? И чекај - зашто?
Јер презентација се може (и хоће) променити. Начин на који смо дизајнирали веб странице пре 15 година готово је непрепознатљив од начина на који их сада представљамо. Али знате шта се није променило? Речи. Још увек их користимо. Интернет постоји првенствено због садржаја (заснованог на тексту). И даље га користимо за решавање информационих проблема; за извршавање задатака. Али ако ваш садржај зависи од начина презентације (уводне Фласх странице, било ко?), Постоји велика вероватноћа да неће бити употребљив за неколико година. И то је срање.
Морамо престати да размишљамо о садржају у смислу изгледа
Ми (као индустрија) смо обучили наше клијенте да размишљају о садржају у смислу изгледа. „Ставите у бочну траку“, кажемо. "То би требало ићи у подножје." Зауставити! Престани. Зауставити. Није ствар у локацији. Ради се о приоритету. Који је најважнији садржај за ваше кориснике? Јер погодите шта: изглед се мења у различитим контекстима. На вашем дизајну малих екрана (вероватно) неће бити бочне траке.
Дивовски супер-мени који жели ваш клијент? Нећу летјети на иПхонеу.
Присилите своје клијенте да планирају свој садржај независно од дизајна
У реду, не морате да их форсирате. Охрабрите их. Снажно охрабрујем. Табеле страница су одличне за ово. Ако је већ нисте прочитали, одмах се обратите Кристини Халворсон и Мелисси Рацх за стратегију садржаја за веб за више информација о томе како их направити. Организујте их по приоритету. Не референцирајте локацију или изглед. Ово ће помоћи вашим клијентима да размисле о свом садржају на продуктивнији начин, а такође ће покренути поступак стварања садржаја, пре финализованих жичаних оквира или дизајна.
Довршите свој садржај пре дизајнирања
У реду, ово није увек могуће. Али што више несигурности можете да уклоните пре него што започнете са дизајнирањем, мање ћете морати касније да се вратите и промените ствари.
Користите прави садржај - сваки пут
Ако је могуће, користите рубни садржај - покажите својим клијентима најкомпликованије странице, слике и меније. Ово ће избећи изненађења касније у процесу, када у готовом производу виде свој најневажнији садржај.
Функционални жичани оквири у прегледачу чине разлику у свету. Омогућите својим клијентима да посматрају како се њихов садржај креће и мења на различитим величинама екрана. Истакните то док представљате своје жичане оквире (радите презентације лично, зар не?) Покажите им како приоритет њихових информација остаје исти на свим величинама екрана, док се изглед мења.
Па како жичани оквири раде за респонзивне дизајнерске пројекте?
Чврсто смо уверени да дизајн интеракција за РВД мора брзо и често да уђе у прегледач. Прилично је немогуће створити статички документ који ће све описати. Наравно, могли бисмо да направимо документ који показује три, четири или пет преломних тачака, али то је само делић приче. Шта је са свим тренуцима између тачака прекида? То се дешава у прегледачу.
Скицирање
Ипак, добро је бити у могућности да брзо заједно скицирате своје идеје. То не треба да се дешава у било ком одређеном медијуму, али постоји само нешто о оловци на папиру. Цела поента је у томе да се идеје изнесу брзо и итеративно. Волимо да скицирамо кад год је то могуће, а за то постоји чак и апликација: УИ Скетцхер.
Оквир у прегледачу
Ево праве карте за нас. Волимо да поново користимо обрасце и системе када демонстрирамо РВД у прегледачу. Наравно, сваки пут бисмо могли да креирамо сопствени систем, али то не помаже ни нама ни нашим клијентима.
Такође волимо да користимо оквире за брзо реаговање прототипова као што су Твиттер-ов Боотстрап или Зурб'с Фоундатион. Ми се лично нагињемо Фондацији јер она одговара нашем току рада. Било би сјајно када би било ко приступио малом екрану са применом ниског пропусног опсега, али управо тако се крећемо.
Биљешке
Напомене за жичане оквире са РВД су од суштинског значаја, али, сматрамо, често се превиде. Реците наглас: документација, документација, документација! Видели смо неколико примера овога од пријатеља и мисле да је порота још увек на „најбољем“ начину да правилно означи жичане оквире који одговарају прегледачу. Као што је горе поменуто, редовно користимо Фоундатион би Зурб и волимо да користимо његов додатак Ревеал за приказивање наших напомена. Ове напомене се појављују само на већим екранима и идеално се могу укључити и искључити.
Користите прави садржај у жичаним оквирима
Око Лорем Ипсум било је пуно расправа у жичаним оквирима и дизајнерским макетама, али ако у својим жичаним оквирима немате стварног садржаја, радите погрешно. Садржај обавештава о одлукама о интеракцији и говори вам када ће се дизајн преломити. Како Лорем Ипсум то може?
Како прво да дизајнирам за мале екране?
Годинама смо дизајнирали с посебном резолуцијом на уму. Била је то подразумевана поставка. Без обзира на скицирање у бележницама, израду жичаног оквира у ОмниГраффлеу, рад у Пхотосхопу или дизајнирање у прегледачу, знали смо која ће бити наша величина платна. Ти дани су нестали. Велико верујемо у прво дизајнирање за мале екране и постепено побољшање. Па како дизајнер мења свој радни ток из фиксне величине платна у флуидан?
Апстрактни дизајн са уређаја на почетку
Ако не дизајнирамо за одређени уређај, неопходно је да престанемо да размишљамо о уређајима и почнемо да размишљамо о искуствима. Све следеће технике помажу дизајнерима да створе своја искуства, а истовремено могу да остану агностични (до тачке).
Користите плочице за стил
Користите плочице за стил да бисте утврдили правац и брзо понављали. Стилске плочице омогућавају дизајнеру да постави смер дизајнерског система без превише прецизирања. Њихов творац, Самантха Варрен, описује их на следећи начин:
„Стиле плочице су за случајеве када је моодбоард превише нејасан, а комп превише буквалан. Стиле плочице успостављају директну везу са стварним елементима интерфејса без дефинисања изгледа. “
Створите хармонију интерфејса
Замислите платно са свим визуелним и интерактивним елементима спојеним заједно. Не да видим одређени распоред корисничког интерфејса, већ да видим како сви елементи раде заједно. Ово је платно хармоније интерфејса. Платно хармоније интерфејса омогућава дизајнеру да идеје држи на окупу, али да није усмерено ни на једну величину екрана. Поред тога, то је одличан начин за ефикасну комуникацију и документовање дизајнираних елемената, уместо да се произведе потпун водич за стил.
Ако сте заинтересовани за даље читање, овде и овде можете пронаћи два изврсна чланка на тему хармоније интерфејса.
Погледајте све у прегледачу
Све треба повезати у прегледач. Овде дизајн УИ заиста оживљава. Кључно је видети како стварни садржај комуницира са визуелним елементима. Не постоји начин да се то уради правилно у статичном окружењу. Морате да видите како ће одговорити на матерњем медијуму.
Нађите равнотежу са статичким програмима
Постоји проток између прегледача и статичних програма као што је Пхотосхоп. Требало би да постоји равнотежа која омогућава да се систем дизајна креира на флуидан и природан начин. Свакако, ово ће се догодити у Пхотосхопу, али дизајнер који реагује дизајнирано мора да научи како да креативно размишља и у прегледачу.
Закључак
Још једном, са осећајем: започните с разлогом, са добро структурираним садржајем и интеракцијама које су важне. Прво се усредсредите на мали екран и малу пропусност и постепено побољшавајте своје концепте који одговарају. Наш медијум постаје пунолетан. Имамо прилику да учинимо ствари како треба и променимо свет, један по један веб пројекат.
Откријте најбољих 20 жичаних алата за дизајнере
Стеве Фисхер координира истраживање, анализу, дизајн и стратегију на Иеллов Пенцил у Канади и говори о темама као што су РВД, УКС и опен соурце. Алаине Мацкензие је стратег за садржај у Иеллов Пенцил.
