20 великолепных форм регистрации


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

Сегодня мы посмотрим на 20 привлекательных и функциональных формх, чтобы увидеть какие-либо полезные идеи, которые можно применить в следующий раз когда будете строить формы регистрации.
Обзор переведен с designshack.net

300 pixels

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

Мне очень нравится 3D графическая кнопка и как она оживляет, когда вы щелкаете по ней. Это делается с помощью изображения и Javascript, но стиль напоминает кнопки BonBon,которые можно бесплатно скачать для CSS3 эксперимента.

Еще одна вещь об этой странице — она использует спрайты изображений. Посмотрите источник, чтобы увидеть исходное изображение.
300 pixels

TestFlight

Гладкиq и простой стиль, просто красиво. Мне нравятся дополнительные накладки на каждый ряд и насколько выбранные поля формы отличается от других.

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

Creditable

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

CertTime

Модальные окна всегда придают спокойствия. Они накладываются на текущее содержание вместо того, чтобы уводить на другую страницу. Это выглядит менее тревожным, чем быть уведенным непонятно куда, люди чувствует себя лучше, как на перерыве.

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

The IdeaLists

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

Кроме того, отличное решение, как в печатной форме, как будто можете видеть как пишете ответы авторучкой.

Pulley

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

ACosmin.com

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

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

Bloom Health

Здесь мне понравилось дружественное сообщение на текстовой форме: «Давайте оставаться на связи.» Слишком часто мы пишем прямолинейно, что-то простое и скучное, хотя несколько минут рассуждений могут привести нас к гораздо более интересным альтернативам.

Avanti

Форма Avanti это все о том, что большую кнопку. Увеличенный размер и смелый выбор цвета сразу обращает ваше внимание на эту часть справа, где вы видите хорошее простое утверждение, что это не совсем призыв к действию, но вместо этого дает установку, что кнопка с точки зрения пользователя, «Подпишет меня». Это не оставляет сомнений в том, что произойдет, когда кнопка будет нажата.

AudioLogica

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

Culinary Culture

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

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

Gowalla

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

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

Buffalo

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

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

Kontain

Самое ненавистное, когда я заполняю длинную форму с 25 шагами, после отправки вижу, что сделал ошибку где-нибудь. Тогда я начинаю искать крошечные звездочки, указывающие, где пошло не так. Это не только я ненавижу, все в этом мире ненавидят! Три ли поля у вас или пятьдесят, вы можете сделать работу пользователей гораздо проще, предоставляя живую, умную обратную связь для каждого поля.

Мы видим это в действии на форме Kontain ниже. Я ввел пароль, который был только из трех букв и появился огромный знак , говорящий мне, что я сделал что-то неправильно, то же самое происходит, если вы введете недействительный адрес электронной почты. Ключевым моментом здесь является не просто обеспечение обратной связи, а ясно видимой и понятной обратной связи, которые пользователь может исправить прежде, чем нажать кнопку отправки.
kontain форма

Zzz

Gowalla имеет веселья сайт и зарегистрироваться скучной форме, которая имеет свои преимущества. Тем не менее, нет нерушимой правило, которое не может иметь небольшую забаву с формами тоже.

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

Vimeo

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

Tea Round

Это один представляет интересный бит из коробки мышление. «Sign Me Up» на право было растянуто по вертикали, чтобы соответствовать высоте двух полей.
Мы не привыкли на нажатие квадратных кнопок в Интернете, таким образом Вы должны быть осторожны с реализацией что-то подобное, но мне нравится, что они сделали здесь.

13 Creative

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

Вместо этого вы должны найти баланс между сделать свой область формы выделиться и сделать его матча с общей темой сайта. Я думаю, что 13 творческих форму ниже является прекрасным примером этой техники в действии.

Obama

———————-
Каталог сайтов

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *