Дизайн интерфейсов

Дизайн интерфейсов — это то, что придает продуманному прототипу вид окончательного продукта. Мы в User House уделяем этому особое внимание.
35
выполненных проектов выполненных проектов
7
лет опыта лет опыта

Как устроен процесс дизайна пользовательских интерфейсов

1. Изучаем продукт
2. Разрабатываем концепцию
3. Разрабатываем дизайн
4. Готовим материалы к верстке
5. Можем сверстать
6. Можем реализовать
Изучаем продукт, выбираем стилевое оформление

На первом этапе разработки дизайна графического интерфейса мы формируем его основные свойства: ориентировочное стилевое решение и эмоциональный фон.

Мы исследуем контекст использования будущего продукта, понимаем, как он будет соотноситься с экосистемой платформы, на которой будет работать и другими родственными продуктами, если они существуют.

Используя общепринятые методики (moodboard, styleboard), мы совместно с заказчиком определяем основную стилистику будущего продукта, а также то, какое настроение должен передавать дизайн интерфейсов пользователям.    

Разрабатываем концепцию дизайна интерфейса

После того, как мы изучили продукт и пожелания заказчика, мы приступаем непосредственно к разработке концепции дизайна интерфейса пользователя: проектируем сетку, определяем шрифтовое решение, разрабатываем дизайн основных типовых блоков и элементов графического интерфейса.

Для целостного восприятия мы отрисовываем 3-4 основных экрана интерфейса в согласованной стилистике. К рабочим встречам с заказчиком мы готовим несколько общих концепций интерфейса: это позволяет быстрее найти подходящие решение, которое отвечает ожиданиям заказчика и пользователей.

При необходимости, на этом этапе происходит адаптация ключевых блоков и элементов интерфейса для всех необходимых разрешений экрана/платформ.

После необходимого числа итераций мы получаем окончательную концепцию графического дизайна пользовательского интерфейса.    

Разрабатываем дизайн типовых экранов, блоков и элементов

После согласования концепции графического дизайна мы приступаем к отрисовке всех типовых экранов, блоков и элементов интерфейса в общей стилистике и для всех необходимых разрешений экрана/платформ. Для элементов (кнопки, раскрывающиеся списки, вкладки, меню, раскрывающиеся блоки и так далее) отрисовываем все возможные состояния, при необходимости — утверждаем правила их применения и использования.

При подготовке дизайна отдельное внимание уделяем исключительным состояниям интерфейса, например:

·   что будет, если название элемента списка слишком длинное,
·   как будет выглядеть нулевое состояние экрана,
·   как будет выглядеть меню, если появится еще один пункт и так далее.    

Готовим метериалы к верстке

После отрисовки всех макетов мы готовим их для передачи в верстку.

Мы используем Sketch и Zeplin, поэтому все свойства интерфейсных элементов (цвета и толщины линий, отступы, размеры и цвета шрифтов, тени и так далее), а также графические ресурсы, могут быть переданы разработчикам очень быстро. Отдельно готовим материалы, описывающие микроанимацию и динамическое поведение элементов интерфейса.

Если необходимо, мы разрабатываем подробный документ — стандарт на дизайн интерфейса. В стандарте мы передаем все знания, которые нужны, чтобы при функциональном развитии продукта, дизайн оставался консистентным и сохранял изначально заложенные идеи.    

Делаем семантически верную верстку

Для продуктов из области web логичным продолжением дизайна созданных интерфейсов пользователя является верстка. Мы можем сверстать созданный нами прототип на основе существующих фреймворков для верстки, например, Bootstrap, или вовсе с нуля. Вертка будет соответствовать дизайну с точностью до пиксела (pixel perfect), будет валидной и при необходимости, адаптивной.    

Разработка интерфейса

Так же необязательный этап дизайна пользовательских интерфейсов, но вполне закономерный. При необходимости, мы можем разработать, спроектированные нами продукты: сайты, включая администраторскую часть, мобильные приложения под iOs и Android, сложные информационные системы под Windows.    

Клиенты, для которых мы работали

Спроектировали интерфейс сервиса таргентинговых объявлений Таргет@Mail.ru и провели экспертную оценка платежной системы Деньги@Mail.ru

Сделали более 15 проектов за 5 лет, в том числе мобильное приложение по управлению счетом и услугами, личный кабинет, формы оплаты банковской картой.

Мы работаем для Вас с 1997 года. Всё это время, мы стараемся создать высочайший уровень сервиса, максимальное количество разнообразных услуг и широкий ассортимент высококачественной продукции. Ведь с развитием этих условий, растёт и развивается наша компания. Одной из наших целей является предоставление, максимально возможно, полного ассортимента продукции для финишной отделки интерьера и экстерьера, это: Общестроительные и специализированные лакокрасочные материалы от ведущих мировых производителей Декоративные покрытия известнейших брендов Химия для очистки и ухода за различными типами покрытий Клеевые смеси, герметики и затирки разнообразных применений Обои под покраску и эксклюзивные коллекции для конечного нанесения Малярный инструмент и сопутствующие материалы высочайшего качества

-

«Happy Bottle» – винный шоу-рум, открытый для того, чтобы разнообразить консервативный рынок диковинками, ранее не известными в России, предложить изысканные сеты, отобранные сомелье, а также высокий уровень сервиса.

ПСБ-Форекс, дочерняя компания Промсвязьбанка, обладает лицензией по обслуживанию физических лиц на внебиржевом рынке Форекс.

Отзывы клиентов

С User House мы разрабатываем ключевой для компании проект. Сейчас уже завершена фаза прототипирования, отдельно хочется сказать, что завершена нетипично для таких проектов быстро – благодаря действительно глубочайшей экспертизе команды в этой области.....

С User House мы разрабатываем ключевой для компании проект. Сейчас уже завершена фаза прототипирования, отдельно хочется сказать, что завершена нетипично для таких проектов быстро – благодаря действительно глубочайшей экспертизе команды в этой области. 

Приятным сюрпризом стала фаза дизайна. Мы планировали использовать ресурс User House для отрисовки вспомогательных блоков проекта, а на создание концепции и разработку дизайна ключевых разделов традиционно привлечь британские агентства. Однако, команда показала не только сопоставимый, но и где-то превосходящий британский уровень качества дизайна. В результате мы выбрали стиль и графическое оформление проекта, предложенное дизайнерами User House. Получается стильный и удобный продукт. Ребята, спасибо и так держать! 

Читать отзыв целиком