Яндекс.Метрика

Дизайн-журнал №1. Актуальная информация для дизайнеров, веб дизайнеров, программистов и разработчиков сайтов.

Творческий подход к реализации полей заполнения

9 июня 2014 | Опубликовано в статьюшечки | 2 Комментариев »

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

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

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

Инновационный подход

1) Однострочная форма

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

Single-Field Form Interface

2) Форма в контектсе разговора

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

Natural Language Form

Формы подписки

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

1) Studio Kit

Studio Kit SignUp Form

2) Дизайн от Bart Nederveen

Bart Nederveen Sign Up Form

3) Дизайн от Daniil Vnoutchkov

Daniil Vnoutchkov Sign Up Form

4) Дизайн от Patrick Rogan

Patrick Rogan Email Sign Up Design

5) Дизайн от Julia Khusainova

Julia Khusainova Sign Up Form

Формы входа и регистрации

1) Snapwire

Snapwire Signup Form Design

2) Farruh Tillaev

Farruh Tillaev Login Form Design

3) Glenn Hitchcock

Glenn Hitchcock Login Form Design

4) Colin Garven

Colin Garven Login Form Design

5) Logoswish

Logoswish Login Form Design

Регистрация кредитных карт

1) Alexey Golovanov

Форма заполнения выполнена в виде кредитной карты.

Alexey Golovanov Credit Card Form Design

2) Single-Field Credit Card

Single-Field Credit Card Form Design

3) Payment Form

Payment Form Design

4) Payment Form




Комментарии

  1. W
    Thumb up Thumb down +6

    Однострочная форма просто шикарна