Небольшое руководство по дизайну для не дизайнеров
ux_journal
Когда мы думаем о дизайне интерфейса, мы думаем о причудливых цветах, стилях и макетах, и, кажется, что это очень сложно сделать. Но давайте посмотрим на дизайны, кажущиеся нам привлекательными и созданные крупными компаниями, и изменения, внесённые в них по мере их развития. Мы узнаем, что простые дизайны великолепно работают.
В этой статье я расскажу вам об изменениях в ряде самых популярных приложений, и о том, как эти изменения могут научить нас создавать улучшенные пользовательские интерфейсы.
Посмотрим на некоторые изменения, внесенные в эти приложения.
Если взглянуть на картинку выше, то мы увидим, как градиенты и 3D-эффекты постепенно упрощались с меньшим количеством цветов и простых иконок.
Аналогично с приложением Facebook. Они удалили эти причудливые градиенты и начали использовать простые иконки.
Давайте посмотрим на некоторые веб-дизайны.
Итак, какие выводы следуют из этих дизайнов?
- Простота и всего несколько цветов
- Расстояние между компонентами
- Использование закругленных углов
- Простые иконки
- Выравнивание
Давайте посмотрим, как мы можем изменить форму входа:
- Форма входа в систему
Начнем со стилей браузера по умолчанию
Теперь давайте поместим их в стек и добавим отступ между ними
Теперь изменим цвет фона, чтобы форма немного выделялась.
Но полученный результат не выглядит великолепно. Давайте подкорректируем его и добавим закругленные углы, рамку и тень.
Добавим внутренние поля в поля ввода и немного изменим границу, и добавим закругленные углы.
Теперь форма выглядит красиво и приятно, но кнопка смотрится не очень. Итак, давайте добавим кнопке заливку выделяющимся цветом и поместим ее справа.
Мы можем видеть, как эти простые изменения сделали дизайн красивым.
Ресурсы и вдохновение:
Я думаю, что это очень важно.
Просто не копируйте и не используйте чужой дизайн. Попробуйте изменить его, потому что, экспериментируя с ним, вы научитесь создавать свои собственные дизайны, которые будут отличаться от других. В противном случае весь Интернет станет одинаковым.