Стаття про те як отримати користувальницький досвід на стадії проектування. Показую це на поточній версії робочого UX-прототипу. Створений у програмі UXPin, дивитися за посиланням тільки на десктопі, мобільна версія окремо.



На його прикладі докладно: про термінологію, ніж інтерактивний прототип краще традиційного (10 моментів), як його використовувати кілька висновків.

Читати далі →

Ідея другої стаття виникла спонтанно і утвердилася завдяки нашим читачам. Після першої статті нам задавали питання і ми розповідали про процес створення сайтів. Кілька разів прозвучав термін «прототип». Дійсно, це важливий етап, який не можна пропустити. У цій статті ми розповімо про наш досвід створення інтерактивних прототипів на платформі PIXLI.



Читати далі →

Здравствуйте шановні читачі, після майже річного періоду обкатки і тестів, ми випустили в світ першу публічну версію нашого продукту – універсальну платформу для web-дизайнерів. Навіщо взагалі вона створювалася – запитаєте ви. Про це і піде мова нижче.

Ідея створення платформи прийшла нам в голову, коли на складних сторінках, в процесі верстки, виникало багато суперечностей між верстальником і дизайнером і на виході виходило не зовсім те, що бачилося спочатку. Особливо, коли мова йшла про складні ефекти. Зрозуміло, щоб досягти належної якості ми витрачали багато часу на «шліфування» роботи. Думка про те, що потрібно спрощувати процес, особливо на середньо бюджетних проектах вже засіла в головах.



Читати далі →

Всім привіт! Спасибі тим, хто, як і раніше стежить за новинами розробки компанії Октодон.

Після невдалого запуску кампанії на Кикстартере в 2014 році наші ресурси і ентузіазм були грунтовно підточені і проект впав в гібернацію. Тобто ми пиляли потроху технології 3d-друку октодонов, але на увазі фоновости цього процесу — дуже повільно.
Незважаючи на це, ми все ж не змогли пройти повз конкурсу Transform the Smartphone Challenge, оголошеного компанією Lenovo спільно з IndieGoGo і вирішили трохи здригнутися.

Дійсно: Moto Mods від компанії Lenovo/Motorola — одна з небагатьох доступних модульних систем для смартфонів. Аксесуари ( мото моди) являють собою змінні задні кришки, коммуницирующие зі смартфоном через фірмовий роз'єм. Зміна модулів не вимагає перезавантаження телефону, так і в цілому для розробників модулів система реалізована дуже зручно.

А оскільки Октодон спочатку планувався саме у вигляді приєднуваної задній клавіатури, і навіть «попереду планети всієї» був реалізований у вигляді змінної задньої кришки для Samsung Galaxy S, не спробувати свої сили з мотомодостроении було б просто недозволено.

Ну ми і спробували. Оскільки справа була в околицях дня св. Валентина, вийшло приблизно так:



Читати далі →

14 рад по використанню Sketch і InVision в роботі дизайнера

image
Инвижн дозволяє дизайнеру продемонструвати замовнику прототип дизайну програми, зробивши його інтерактивним. Крім того, завдяки Инвижн, можна організувати злагоджену роботу всередині команди, між дизайнером, менеджером проекту, верстальником і програмістами, незалежно від платформи (mac os, Windows, Linux). Пропоную вашій увазі зручні сценарії використання зв'язки Sketch + InVision.
Читати далі →

Axure. Удар інтерактивом по інтерфейсу. Проби і помилки

Axure
  • Дійсно цей продукт не більш ніж інструмент для прототипування?
  • Може UI designer повністю перейти на роботу в Axure, відмовившись від інших інструментів?
  • Які сильні та слабкі сторони цієї програми?


Я постараюся знайти відповіді на ці питання нижче. Порівняно недавно я вирішив піти від Adobe Photoshop до Axure, раптово розкривши для себе потенціал цього інструменту, не тільки як засобу для прототипування.

Читати далі →

Що таке UX/UI дизайн насправді?

Дуже багато непорозумінь в середовищі дизайнерів і розробників. Також багато дурних питань, пов'язаних з UX і UI у новачків. Часто просто з-за того, що люди не знають суті поняття UX/UI і, не знаючи про що говорять, називають речі своїми іменами.

Я хочу раз і назавжди поставити крапку і простою зрозумілою мовою пояснити, що значить «UX/UI дизайн».

UX/UI дизайн на прикладі точильних каменів

Читати далі →

Проектна папка дизайнера. Частина 2

image
Вивчивши коментарі до попереднього посту про проектної папки, вирішив перебудувати процес, пов'язаний з версіями файлів та їх зберіганням. Розумні люди говорили, що в наш час неправильно дублювати файлики вручну, створюючи архів версій, а потрібно користуватися сучасними технологіями Git, Subversion і подібними. В цьому пості напишу про систему до якої прийшов і з задоволенням тепер користуюся. Я став спокійнішим, їм краще і міцніше сплю, адже тепер я зовсім не переживаю за робочі файли і їх збереження. Залишилося стати хорошим дизайнером.
Читати далі →

Кейси: розробка специфікацій і гайдлайнов (web ui kit)



Сьогодні я поділюся досвідом розробки графічної документації по гайдлайнам. Це виявилося моє друге завдання для Viline. І як Ви не пам'ятаєте з першої частини, я робив редизайн сторінки відео-курсу. У даній статті я опишу процес розробки стилістики всіх елементів і різних станів. Придумаю і сформулюю деякі правила, щоб інтерфейс вийшов збалансованим і доступним з урахуванням аудиторії…

Читати далі →

Серйозне проектування серйозних сайтів. Частина 2. Візуалізація

Це друга частина статті про проектування великих сайтів. У ній ми розповімо про візуальну частину проектування, про інтерфейси. Якщо ви не читали першу частину, то рекомендую це зробити тут: habrahabr.ru/company/SECL_GROUP/blog/318598

Динамічний прототип


Рис. 9. Демонстрація динамічного прототипу для проекту «Маркетплейс».

На цьому етапі ми переходимо від аналітики до інтерфейсів, до візуальної частини. На основі Mind map необхідно спроектувати інтерфейси для кожної функції і сторінки. Таких інтерфейсів в нас буде багато, від декількох десятків до декількох сотень унікальних прототипів, а ще є розкадровки, коли одна сторінка може мати ряд станів, спливаючих вікон, що випадають блоків і т. д. У процесі всі прототипи об'єднуються в один великий динамічний прототип і зв'язуються між собою.

Читати далі →