Що таке правильний дизайн та як з ним пов’язані прототипи сайтів
Надя Помінова
У дизайні продуктів та у дизайн спільнотах відбуваються зовсім протилежні речі. З одного боку, існують такі чудові статті, як статті від Ryar Singer та Julie Zhuo, які рухають нашу професію вперед. З іншого боку, зростає кількість людей, які публікують та обговорюють свої роботи на Dribble, і це тягне нашу професію назад. Цей пост не про Dribble як таке, а про те, чого варте Dribble-спільнота. Протягом усієї статті я використовуватиму термін «дизайн продукту», але під цим я також маю на увазі дизайн досвіду використання та інтерактивний дизайн.
«Виглядає чудово!». Як Dribble-спільнота заохочує поверхневі роботи
Найважливіший дизайн продукту, як правило, найпотворніший
У контрасті з вищесказаним, найкращі претенденти, яких я бачив, надсилають роботи, більше схожі на перебіг їхніх думок: нариси, діаграми, опис за і проти, реальні проблеми, компроміси та рішення, прототипи та ілюстрації взаємодії, анімації. Речі, що рухаються, змінюються, оживають. Речі, у яких використовуються реальні дані.
Найгірші претенденти надсилають плоскі PNG. PDF, заповнені схемами. Жодного зв'язку з вирішенням проблем, жодних пояснень технічних та бізнес-обмежень. Жодного контексту. Ці ідеальні пікселі, адаптовані під ретину, будуть чудово виглядати на dribbble, але вони знижують цінність дизайну як інструменту, що створює систему.
Ось чому переробка дизайну інших людей - чиста дурість. Взяти, наприклад, новий логотип Yahoo, iOS 7, зміни в інтерфейсі Facebook, новий новий Twitter, ребрендинг Americam Airlines. Люди занадто далекі від контексту, щоб судити про рішення, прийняті під час цих процесів, вони не мають належних знань і вимог, не знаютьобмеження та політики організації.
Якщо дизайн продукту - це вирішення проблем в умовах обмежень і специфіки бізнесу, то складається враження, що люди, які називають себе дизайнерами продукту або дизайнерами досвіду користувача, насправді просто практики цифрового мистецтва. Вони художники. Вони стилісти. Робити речі красивими – безумовно, дуже важлива навичка, але це не дизайн продукту.
Дизайн продукту – це місія, це бачення, це архітектура
Від глобальної ідеї і до пікселя дизайнери повинні постійно пам'ятати про місію їхньої компанії, бачення та архітектуру продукту. Все, що вони роблять, має проходити через цю лійку.
Місія — навіщо ми існуємо, крім того, як заробляти гроші? Бачення — У що ми віримо щодо майбутнього? Як це допоможе нам виконати свою місію?
Дизайн починається з місії компанії. Потім відбувається через бачення компанії. Важко робити гідний дизайн у компанії, де немає ясних, які знаходять застосування на практиці, місії та бачення. Якщо у вашій компанії не вистачає місії, створіть її.
Після місії та бачення йде архітектура продукту. Чи не технічна архітектура, а компоненти вашого продукту і те, як вони взаємодіють один з одним - система. Першого ранку першого ж дня своєї роботи в Facebook Кріс Кокс (віце-президент продукту) прочитав неймовірну вступну лекцію перед людьми, які виконують різні функції в компанії. Він міг розповісти будь що, але він сфокусувався на архітектурі продукту та на тому, як це співвідноситься з місією компанії.
Архітектура Facebook - це каталог людей, їх друзів, їх інтересів, це каталог компаній від великих брендів і до маленького магазинчика на розі. Вершина цієї архітектури - карта, що показує взаємини між усіма цими.складовими. Це кристально чиста артикуляція продукту безпосередньо пов'язана з місією. На власному досвіді я переконався, що важко побудувати гарний дизайн у компанії, де немає чіткої архітектури.
Найчастіше, як і у випадку з місією — це робота дизайнера — допомогти розкрити та розвинути архітектуру компанії. Коли я описував архітектуру Facebook партнерам збоку, зазвичай я малював наступну діаграму на дошці:

Архітектура продукту не те саме, що інформаційна архітектура. Це не набір сторінок, які пов'язані один з одним, і не опис того, що робить якась кнопка. Цю функцію завжди краще виконувати прототип. Архітектура — більш глибокий рівень, ніж це. Це структура. Це цегла, з якої збудовано будинок. Вона показує об'єкти системи та зв'язку між ними. Не пригадаю, щоб коли-небудь побачив архітектуру продукту, описану на Dribbble. Досі дуже рідко можна побачити, що дизайнерка розповідає про те, як його робота співвідноситься з місією, рухає бачення вперед або як вона вкладається в архітектуру продукту. Це має бути нормою, а не винятком.
Коли у вас є місія, бачення та архітектура продукту, ви можете подумати про інші деталі. Цілі, які мають люди, що робить їх щасливими, наповненими, успішними. Робота, яку ваш продукт виконує для них, де він працює добре, а де ні.
Грубі, потворні нариси і каракулі, що описують всі ці речі, набагато важливіші за png, викладені на Dribbble. У процесі від початку створення до готового функціонуючого продукту мене найменше хвилюють png і psd. Найважливіше у цій дискусії — те, де було знайдено альтернативи, які за і проти доводилося зважувати, де люди співвідносили ідеї з баченням компаніїчи розвивали ідеї, засновані на архітектурі продукту. Малюнки на дошці, малюнки від руки та зворотний бік серветки, що описують вирішення проблеми, - те, що дійсно треба викладати на Dribbble. Покажіть це мені. Та навіть письмовий опис того, що створюється, набагато важливіший за png або pdf.
Дизайн – багатошаровий процес. На мій досвід, є оптимальний порядок цієї пошарової роботи - найпростіше думати про 4 шари:

Я бачив, як один за одним дизайнери зосереджувалися на 4 шарі, не беручи до уваги решту. Працюють знизу нагору замість того, щоб працювати зверху вниз. Сітка, кольори, шрифти, естетика ні до чого, якщо ви поки що не розібралися з попередніми трьома шарами. Багато дизайнерів, кажуть, працювали з ними, але насправді це не так. Найчастіше для них набагато веселіше намалювати красиву картинку і закопатися в пікселі, ніж мати справу з заплутаними бізнес-рішеннями та людьми з різними думками.
Дизайн систем означатиме все більше і більше у міру того, як web проникає всюди
Винахід Інтернету викличе найбільші зміни в суспільстві з усіх, що відбувалися з часів індустріальної революції. Інтернет проникає всюди. Він у наших будинках, на наших робочих місцях, поруч із нашим ліжком, коли ми спимо, у наших кишенях, куди б ми не пішли. Інтернет із нами постійно. Він уже проникає у наші машини, наш одяг, наші речі, моніторинг нашого здоров'я. До 2020 року, якщо не раніше, всі бізнеси будуть веб-бізнесами. Як сказав одного разу Чарльз Імз, «врешті-решт все з'єднується».
Проектування статичних, пов'язаних сторінок — професія, що вмирає. Неймовірне зростання мобільних технологій, API, SDK, відкриті партнерства між платформами і продуктами малюють нам кристально чисту картину майбутнього, де ми всі створюємо системи. PDFз прототипами вмирають, Photoshop як інструмент дизайну продукту також вмирає. Дизайнери штовхають нашу майстерність вперед, маневруючи між начерками, маркерною дошкою та інструментами прототипування (Quartz Composer, After Effects, Keynote, CSS/HTML). Дизайнери штовхають нашу майстерність вперед, маневруючи між начерками, маркерною дошкою та інструментами прототипування.
Ось чому люди кажуть, що дизайнери мають кодувати. Чи погоджуєтесь ви з цим чи ні, дизайнери — це люди, які мають визначити проблему, і рішення лежить не в пікселях, а в описі того, що відбувається між компонентами системи. Потім уже прототипи, код та точне виконання деталей. Тільки реальні дані неминуче показують речі, які ми прогавили або які неможливо було передбачити.
Робота з реальними даними дає вам найкраще розуміння того, як щось відчувається.
Ми будуємо дизайн за принципом Клейтона Крістенсена
В інтеркомі ми працюємо за принципом Клейтона Крістенсона для дизайну продукту. Ми обрамляємо кожну дизайн-проблему в роботу, ми фокусуємося на пусковій події або ситуації, мотивації, меті та передбачуваному результаті: Коли___, я хочу___, щоб я міг___. Наприклад: коли реєструється новий важливий клієнт, я хочу повідомити про це, щоб почати спілкування з ним.
Це дає нам прозорість. Ми можемо співвіднести цю роботу з місією та правильно розставити пріоритети. Так, ми можемо бути впевнені, що ми постійно дотримуємося 4 шарів дизайну. Ми розуміємо, які компоненти системи є частиною роботи, яка має бути виконана, та необхідні відносини та взаємодії, щоб полегшити її. Ми можемо дизайн від вершини до низу, рухаючись через результат,систему, взаємодію до того, як приступимо до візуального дизайну.