Як «прокачатися» дизайнеру поради та корисні посилання від українських експертів
У блозі на Хабрі ми пишемо про розвиток веб-технологій та їх практичне застосування — раніше публікували історії нетехнарів, які вивчили верстку та отримали роботу у сфері ІТ, і сьогодні продовжимо тему навчання. Ще одна сфера, яка близько пов'язана з версткою, це веб-дизайн. Цього разу ми попросили українських інтернет-експертів дати поради щодо професійного розвитку для дизайнерів-початківців.
Денис Кортунов, директор з UX в Acronis
Дизайнери повинні постійно вчитися та «прокачувати» свої навички. У цьому є суть професії. Якщо перестав навчатися чи робити щось нове, то ти мертвий як дизайнер. Таким чином, усі «живі» дизайнери знають, як і де вчитися. Не думаю, що я можу їм щось корисне порадити. Але я спробую:
- Потрібно постійно практикувати дизайн. Вирішувати нові завдання, малювати концепти, куштувати модні штуки, вивчати нові інструменти. Не можна бути хорошим дизайнером лише теоретично.
- Іноді варто дивитись, що роблять інші дизайнери. Використовувати свої ідеї, але по-своєму. Але цим не варто захоплюватися, немає жодного сенсу щодня переглядати всі блоги про дизайн.
- Вивчати і пробувати ще щось, крім дизайну. Найкращий дизайн завжди виходить на стику з технологіями або іншими предметними областями. Я нещодавно витратив кілька днів, щоб зібрати величезний трактор Lego Technic — мені здається, це буде корисно і в роботі.
- Дизайнерські тусовки та конференції – дуже корисний спосіб провести час. Всім дизайнерам дуже раджу поїхати на OFFF до Барселони.
Антон Шинефт, дизайнер, працював над проектами Cossa.ru, ПостНаука
Насамперед варто усвідомити, що дизайн — це дужевелике поле діяльності, і якщо ви все-таки зважилися піти на цей відчайдушний крок, будьте готові витрачати весь свій вільний час на це заняття. Втім, впевнений, що це правило стосується і будь-яких інших видів діяльності.
Суть така, що якою б надідеєю та уявою не мала людина, без знання інструментів, техніки та теоретичної бази ці здібності можуть виявитися марними. Слід виділити кілька областей, в яких варто прокачуватися, роблячи це паралельно, отримуючи мультиплікативний ефект. Всі ці області переплітаються і, узагальнюючи знання, можна отримати вражаючий результат.
Щодо практичного застосування, то кращого способу, ніж спроби імітувати стиль, знаходити інструменти, щоб зробити щось схоже, не вигадати. Тільки навчившись різних прийомів, можна винаходити свій. Сьогодні дизайнери мають неймовірний простір для творчості, вивчення нових програм, не обмежуючись стандартним пакетом Adobe.
Для того, щоб працювати «не в стіл», є також величезна кількість ресурсів. Мотивуючи себе навіть виставленими термінами, можна спробувати взяти участь в онлайн-конкурсах. Наприклад, 99 designs.
Зрозуміло, це вимагає витримки та посидючості. Знаю людину, яка починала практикуватися в дизайні на цьому сайті і через три місяці знайшла постійного клієнта зі США з контрактом.
Ну і звісно, Dribbble. До речі, є два запрошення. Віддам тим, чиї роботи сподобаються.
Павло Горшков, дизайн-директор Redmadrobot
Якщо говорити насамперед про дизайн інтерфейсів, то ще кілька років тому значна частина дизайнерів були самоуками, найчастіше з багажем знань, отриманих на практиці, досить хаотично сформованим. Нині ситуація змінилася: колишньої нестачіінформації немає, а ринок підтягнувся і наповнився професіоналами, які готові поділитися своїм досвідом.
- Apple: iOS Human Interface Guidelines та Design: Apple Developers
- Android: Google Design та Material Design Guidelines
- «Подання інформації», Едвард Тафті
- «Головні принципи інтерактивного дизайну», Брюс Тогнацціні
- «Психлікарня в руках пацієнтів», Алан Купер
- «Дизайн для реального світу», Віктор Папанек
- «Дизайн: форма та хаос», Пол Ренд
- «10 правил гарного дизайну», Дітер Рамс
- "Tapworthy", Josh Clark
- "Don't Make Me Think", Steve Krug
- «Дизайн мобільних додатків» у Британській вищій школі дизайну
- Школа дизайну «Середовище навчання»
Антон Шеїн, керівник служби дизайну пошукової видачі Яндекса
Чи має дизайнер вміти працювати з веб-технологіями?
Правильне питання: чи допомагає володіння веб-технологіями дизайнеру вирішувати завдання? Так, допомагає. Особливо якщо ви працюєте у продукті, у якому важливу роль відіграють дані.
З чого розпочати вивчення веб-технологій?
Є багато інтерактивних онлайн-курсів. Але, на мою думку, починати треба не з них. Коли ви приступаєте до занять бойовими мистецтвами, спочатку вас не стануть вчити прийомам. Спершу вам потрібно буденавчитися бігати, віджиматися, присідати - тобто всіляко підготувати своє тіло до занять.
Так і тут. Почати потрібно з двох дуже важливих навичок:
Як тренажер краще використовувати The Typing Cat або Клаваріг. Інші тренажери — знущання з психіки, і від них більше шкоди, ніж користі.
Почавши тренуватися друкувати наосліп, не піддавайтеся спокусі перейти назад на звичний метод, навіть якщо дуже хочеться. Швидкість навчання від цього прагнутиме нуля: так влаштований мозок.
Навичка корисна не тільки для коду. Почавши друкувати наосліп, ви заощаджуватимете купу часу на листуванні.
Краще почати з простих серіалів, тому що "Шерлока" або "Теорію великого вибуху" дивитися буде важко. Сам я сильно просунувся англійською, поки дивився Lost під час тренувань. Там дуже проста англійська, а сюжет невигадливий настільки, що і без перекладу зрозуміло, що відбувається.
Але курси мають біда: вони все дуже поступово і повільно розжовують. Встигаєш заснути, так і не дійшовши до суті.
Бонус: кілька виступів Антона на тему дизайну та прототипування:
Михайло Шишкін, засновник та креативний директор брендингової агенції SHISHKI
Сьогодні зростає попит на фахівців, які не просто «прокачані» у своїй галузі, а й уміють дивитися на всі боки (T-shaped person). Чим ширший кругозір, тим вища ймовірність того, що в певний момент свіжа ідея з іншої галузі знань збагатить поточний проект, допоможе поглянути з боку або застосувати нові цікаві рішення з іншої області.
Саме тому я вважаю, що сучасним дизайнерам варто обов'язково вивчити основи верстки. Я виділив би чотири основні причини, чому це обов'язково потрібно:
- Знання верстки дає розуміння обмежень того, що ти робиш, щоб не намалювати чогось нераціонально здійсненного. Хороший верстальник зверстає все, тільки ось чи це буде ідеально з точки зору трудовитрат?
- Кругозір. Знання технічних прийомів — це знання обмежень, а й навпаки, можливостей, які дає технологія. Щоб раніше не включити самоцензуру і не «спрощувати» все треба розуміти, що насправді можна. Сміливість рішення ґрунтується на розуміння можливості його реалізувати. Знаєш, що це можливо – запропонуєш класний хід. Не впевнений - співсторожуєш.
- Не дати лінивому верстальнику себе залякати. На все «так не згортати» ти зможеш відповісти «навіть я знаю як» якщо звичайно, то можна згорнути, і ти хоча б приблизно знаєш, як це зробити.
- Емпатія. Чули про таку? Це коли ти співпереживаєш проблемам інших людей — дуже корисно для здорових та продуктивних стосунків із людьми, з якими безпосередньо спілкуєшся по роботі. Зрозумій проблеми колег, і ти легше розташуєш їх до себе.
Вадим Макєєв, веб-євангеліст HTML Academy
А потім порівняв його з простим фрагментом коду, що циклічно анімує фонову картинку, де вона описана простими англійськими словами:
Така анімація виходить легкою, плавною, настроюваною і зрозумілою верстальнику. Можете подивитися прямо на слайдах, які теж зверстані.
У цьому, здається, і лежить відповідь: не кидайтеся освоювати весь стек веб-технологій з нуля і до зірок. Усього не знають навіть найдосвідченіші верстальники. Почніть вирішувати свої завдання ефективніше, за завданням за раз.
- Зробіть гумову адаптивну сітку на флексах або гридах і перевірте самі, як вона виглядає на різних пристроях — замістьтого, щоб малювати цеглу під три дозволи, адже їх щонайменше триста три.
- Анімуйте випадання меню або розгортання акордеону саме так, як вам хочеться, а не так, як зумів ваш верстальник. З напівпрозорістю, правильною плавністю та прискоренням.
- Здивуйтеся наскільки різним буває згладжування шрифтів на різних платформах: від macOS до Windows (або найпростіших мобілок) і перестаньте вже вимагати, щоб воно було суворо таким, до якого звикли у Photoshop.