Теория близости: главное правило дизайна, которое помогает перейти от субъективных ощущений к конкретике

Автор: admin от 26-03-2017, 16:50, посмотрело: 376

Впервые о теории близости я прочитал в 2007 году. Она была сформулирована так: «объекты, расположенные близко друг к другу, воспринимаются связанно». Тогда я подумал: «спасибо, Кэп! Я как-то и сам догадался, что букву “М” нужно вешать ближе к мужскому туалету, а не к женскому». Тогда я не осознал, что это одно из главных правил дизайна, которое помогает подбирать расстояния между элементами, размеры полей, расположение кнопок, размер логотипов и многое другое. А главное, теория позволяет быстро понять, хороший перед вами дизайн или нет, даже если вы не дизайнер.
Теория близости: главное правило дизайна, которое помогает перейти от субъективных ощущений к конкретике

Категория: Программирование » Веб-разработка

 

Создаем дизайн-систему

Автор: admin от 26-03-2017, 11:15, посмотрело: 269

Вне всякого сомнения, о дизайн-системах меня спрашивают чаще, чем о чем-либо другом. За последние несколько лет я посвятил много времени размышлениям о том, как выстраивать, реализовывать и представлять дизайн-системы для таких продуктов, как Marvel, Bantam и Modulz, и теперь решил, что пришла пора поделиться тем, чему научился в процессе.

Создаем дизайн-систему

Что такое дизайн-система?

Ни для кого не секрет, что дизайнеры любят хорошие UI-киты. Но, по моим наблюдениям, в последнее время все больше внимания уделяется не просто наборам инструментов и руководствам по стилю, а созданию систем, которые связывают воедино целые продукты. Компании вроде Shopify и Intercom формируют особые команды, которые занимаются только и исключительно дизайн-системами. Люди начинают осознавать, как важен системный подход в дизайне. Это внушает оптимизм. Кто знает, возможно, в один прекрасный день появится инструмент для дизайнеров, который не будет предполагать, что в каждом новом проекте мы начинаем все с нуля.

Категория: Программирование » Веб-разработка

 

В чем отличие UI и UX? Подробный разбор часто используемых терминов

Автор: admin от 24-03-2017, 16:05, посмотрело: 393

В сегодняшней креативной и технической среде термины UI (user interface/пользовательский интерфейс) и UX (user experience/опыт взаимодействия) используются больше, чем когда-либо. В целом, они относятся к деталям и идеям, которые были актуальны в течение многих лет, еще до появления этих аббревиатур.

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

В чем отличие UI и UX? Подробный разбор часто используемых терминов

Категория: Программирование » Веб-разработка

 

Проектирование анимации или как я в дизайнерскую авантюру ввязался

Автор: admin от 24-03-2017, 06:00, посмотрело: 261

Проектирование анимации или как я в дизайнерскую авантюру ввязался

Вот уже неделя с небольшим минула, как я решил ввязаться в дизайнерскую авантюру! Daily UI это опциональный челлендж для любого профессионального графического разработчика. Каждый день — новый дизайн. Чего угодно: кнопки, таблички, хедеры, карточки, да любой элемент вплоть до целого раздела. По итогам этого “марафона”: во-первых, прокачиваются навыки; во-вторых, прокачивается карма и последователи; в-третьих, да мало ли к каким интригующим последствиям это может привести. Обычно такой марафон длится 100 дней.

Однако, я немного адаптировал условия этого личного соревнования под себя. Количество дней не ограничиваю, в выходные отдыхаю, а результатом каждого дня будет не *.sketch / psd исходники, а HTML/CSS/JS файлы. И, да, вы всё это можете скачать и применять для своих нужд. Именно поэтому в выходные я и отдыхаю! Всё ясно? :)

Тогда читайте дальше...

Категория: Программирование » Веб-разработка

 

Лучшие практики для поисковой выдачи

Автор: admin от 20-03-2017, 14:10, посмотрело: 253

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

В этой статье я бы хотел поделиться 10 практиками, которые помогут вам усовершенствовать UX страницы с результатами поиска.

Лучшие практики для поисковой выдачи

Категория: Программирование » Веб-разработка

 

Создаем идеальную строку поиска

Автор: admin от 16-03-2017, 16:35, посмотрело: 687

Строка поиска состоит из совокупности текстового поля и кнопки ввода. Казалось бы, дизайна здесь даже и не нужно — в конце концов, речь идет всего лишь о двух простых элементах. Но на сайтах с большим количеством контента строка поиска зачастую оказывается тем элементом дизайна, которым посетители пользуются чаще всего. Открывая сайт с относительно сложной архитектурой, пользователи сразу же обращаются к строке поиска, чтобы попасть в пункт назначения быстро и безболезненно. И тут неожиданно оказывается, что дизайн строки имеет большое значение.

Создаем идеальную строку поиска

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

Категория: Программирование » Веб-разработка

 

Дайджест продуктового дизайна, февраль 2017

Автор: admin от 13-03-2017, 17:25, посмотрело: 237

Уже семь лет я публикую регулярные обзоры свежих статей по теме интерфейсов, новых инструментов и коллекций паттернов, интересных кейсов и исторических рассказов. Из лент нескольких сотен тематических подписок отбирается примерно 5% стоящих публикаций, которыми интересно поделиться. Предыдущие материалы: апрель 2010-январь 2017.

Дайджест продуктового дизайна, февраль 2017

Категория: Программирование » Веб-разработка

 

+500 бесплатных инструментов для запуска вашего стартапа в 2017 году

Автор: admin от 10-03-2017, 14:10, посмотрело: 350

+500 бесплатных инструментов для запуска вашего стартапа в 2017 году

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

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

Итак, мы нашли в интернете бесплатные и условно-бесплатные инструменты для роста вашего бизнеса. Когда они дадут вам желаемый результат, вы можете оформить платную подписку.

Категория: Программирование » Веб-разработка

 

Magento BarCamp — новый сезон докладов. Март 2017

Автор: admin от 10-03-2017, 09:50, посмотрело: 234

Magento BarCamp — новый сезон докладов. Март 2017

Баркемп (англ. BarCamp) — международная сеть конференций, которая создаётся её участниками. Конференции открыты для всех, проходят в формате докладов, тренингов, презентаций, обсуждений. Весь материал предоставляется самими участниками. © — Wiki

Подобные мероприятия в Magento проходят на регулярной основе. И в последующем также будут освещаться здесь.
Вашему вниманию представляются видео докладов с мартовского ивента.


  • «Magento Performance Patterns», Андрей Касьян

  • «PhpStorm: Tips & Tricks», Юрий Григорьев

  • «Kaizen», Александр Осадчий

  • Scalable Omnichannel Capabilities, Jason Woosly

  • John Doe and ‘Interfaces of Happiness’, Виталий Коротун


Больше под хабракатом

Категория: Программирование, Веб-разработка

 

Как мы делали экосистему – единый «язык» дизайна для front end десятков связанных систем

Автор: admin от 9-03-2017, 00:20, посмотрело: 279

В этом посте мы расскажем о том, как учились разговаривать с пользователем на «языке» дизайна UI/UX и пришли к необходимости создания единой экосистемы для разных приложений одного заказчика. А также о том, какие технологии в этом помогли.
Как мы делали экосистему – единый «язык» дизайна для front end десятков связанных систем
Что мы подразумеваем под единой экосистемой? Это комплекс разных IT-решений, веб- и мобильных приложений, объединенных единым «языком», на котором они разговаривают с пользователем. Такой язык есть, например, у всех продуктов Microsoft или у всех устройств Apple. Какое бы приложение одного и того же производителя вы не открыли, оно будет повторять логику своих «сородичей», показывать вам знакомые иконки.
Для компаний, создающих цифровые продукты, единая экосистема – ключевое конкурентное преимущество. Для нецифровых компаний, которые переходят «в цифру», создание аналогичных единых экосистем становится необходимостью, поскольку дает много преимуществ. В первую очередь, конечно, обеспечивает пользователям однородный UX и UI во всех системах, облегчает поддержку и обновление систем, повышает конверсию и удовлетворенность клиентов.
Разработка такой экосистемы стала для нас итогом длинного пути, о котором мы и расскажем.

Категория: Программирование » Веб-разработка