Comments 59
вообще интересно
а по юзабилити: нет кнопки "Отмена", если кнопка регистрация вверху страницы (проскроллил кто-нибудь так) - то саму форму юзер не увидит нормально, много ограничений в использовании
а по юзабилити: нет кнопки "Отмена", если кнопка регистрация вверху страницы (проскроллил кто-нибудь так) - то саму форму юзер не увидит нормально, много ограничений в использовании
Насчёт «отмены» — поподробнее, если можно.
А насчёт проскроливших — форма выскакивает по нажатию на кнопку, и фокусируется. Я думаю это привлечёт достаточно внимания и пользователь не ускролит никуда, если уж нажал.
А насчёт проскроливших — форма выскакивает по нажатию на кнопку, и фокусируется. Я думаю это привлечёт достаточно внимания и пользователь не ускролит никуда, если уж нажал.
Есть пара улучшений:
1. "Пароль (х2)" лучше исправить на "Пароль (повтор)" - недосоаточно искушенные пользователи могут подумать, что нужно ввести либо два разных пароля, либо вообще два раза ввести один и тот же в одном поле :)
2. Справа от полей есть квадратики, которые не выполняют никакой функции - их можно использовать. Пока форма не заполнена, в них можно отображать необходимость обязательного заполнения тех или иных полей. Когда поле заполняется, в квадратик можно ставить галочку для соответствующей индикации.
1. "Пароль (х2)" лучше исправить на "Пароль (повтор)" - недосоаточно искушенные пользователи могут подумать, что нужно ввести либо два разных пароля, либо вообще два раза ввести один и тот же в одном поле :)
2. Справа от полей есть квадратики, которые не выполняют никакой функции - их можно использовать. Пока форма не заполнена, в них можно отображать необходимость обязательного заполнения тех или иных полей. Когда поле заполняется, в квадратик можно ставить галочку для соответствующей индикации.
Первое принимается с умеренным ликованием:
А вот второе предложение ознаменовало крах наглядности моей задумки (квадратики на самом деле «выполняют функцию», все поля в данном случае обязательны, квадратик красный до заполнения поля, и зелёный — после).
А вот второе предложение ознаменовало крах наглядности моей задумки (квадратики на самом деле «выполняют функцию», все поля в данном случае обязательны, квадратик красный до заполнения поля, и зелёный — после).
Красный никак не ассоциируется с "до заполнения" - лучше делать его красным при ошибочном заполнении, если такая проверка есть.
До заполнения квадратики можно оставить без цвета, а при успешном заполнении - зелёным.
До заполнения квадратики можно оставить без цвета, а при успешном заполнении - зелёным.
Сделайте лучше зелёные галочки вместо квадратиков, когда поле заполнено правильно, или красный крестик, когда что-то не так. Привычнее и понятнее.
1) Убрать квадратики, сделать красный и зеленый отсвет на самом поле.
2) ИМХО названия полей надо сделать все же слева, так будет много нагляднее.
3) К нику должно быть пояснение, какими символами его вводить.
4) Крестик сверху не достаточно интуитивен имхо, при такой огромной кнопке ОК.
2) ИМХО названия полей надо сделать все же слева, так будет много нагляднее.
3) К нику должно быть пояснение, какими символами его вводить.
4) Крестик сверху не достаточно интуитивен имхо, при такой огромной кнопке ОК.
Ну здесь есть с чем поспорить.
Отсвет на самом поле — это неплохо, а вот названия полей в моей ситуации расположены единственным возможным способом (ширина бокса ограничена). Пояснение к нику (да хоть и к пассворду) — принимается, а насчёт крестика... ммм, можно сказать что это нежная подтасовка («окея» хочется гораздо больше, чем «нунаха»).
Отсвет на самом поле — это неплохо, а вот названия полей в моей ситуации расположены единственным возможным способом (ширина бокса ограничена). Пояснение к нику (да хоть и к пассворду) — принимается, а насчёт крестика... ммм, можно сказать что это нежная подтасовка («окея» хочется гораздо больше, чем «нунаха»).
Кстати, о названиях полей — может придвинуть надпись на пару пикселей поближе к тому полю, к которому она относится?
Помучаю верстальщика.
Эээ так это у вас в HTML верстаться будет? JavaScript стало быть. Будет ли регистрация работать с отключенным JavaScript? Вообще зачем такие сложности? Почему бы не сделать обычную форму, в которой сразу видно все поля?
Кстати, не лучше ли поле для никнейма сделать самым первым? А поле Пароль (повтор) именовать сообразно человеческому языку: Повторите пароль?
Кстати, не лучше ли поле для никнейма сделать самым первым? А поле Пароль (повтор) именовать сообразно человеческому языку: Повторите пароль?
Согласен! Верно подмечено.
Ну никто не мешает сделать окей большим, а кенсел поменьше, но все же разумней разместить их на одной строчке, чтобы юзер не искал настолько неприметный элемент пол часа. Но эт мое мнение тока :)
Ну вкратце я себе это как-то так представляю.
http://rb.foto.radikal.ru/0707/f8/bf60b1f9cf29.jpg
Ваше оформление копировать лень было :) Ну я думаю вы можете представить как это будет выглядеть.
http://rb.foto.radikal.ru/0707/f8/bf60b1f9cf29.jpg
Ваше оформление копировать лень было :) Ну я думаю вы можете представить как это будет выглядеть.
Супер! Эх, была бы такая регистрация на всех сайтах.. :)
квадратики справа (эти диоды заполненности) на самом деле функционально хороши, а визуально сильно режут глаз. Особенно в сочетании с кнопкой отмены. Может квадратик сделать по высоте таким же как и строка и на волос оторвать от неё?
На счет отмены: оставить кнопку наверху, но сделать аналогичной нижней - во всю ширину окошка (с подписью Отмена вместо крестика), а в высоту на две трети меньше и без цвета.
На счет отмены: оставить кнопку наверху, но сделать аналогичной нижней - во всю ширину окошка (с подписью Отмена вместо крестика), а в высоту на две трети меньше и без цвета.
Так, что-ли?
толщину их можно в два раза меньше делать. А Отмену имхо лучше текстом, по высоте еще меньше (треть от нижней кнопки, я же писал) и без цвета (тоже писал), иначе привлекает слишком много внимания.
Но мне кстати, вариант wazd'а (тот что ниже) больше нравится - без кубиков.
Кстати, а нужна ли вторая стрелочка внутри большой? Лишняя, видно же.
Удачи!
Но мне кстати, вариант wazd'а (тот что ниже) больше нравится - без кубиков.
Кстати, а нужна ли вторая стрелочка внутри большой? Лишняя, видно же.
Удачи!
Технологичнее помечать поля, задав для них особый цвет рамки. Как вариант: заполненные поля имеют дефолтную отрисовку рамки, а те, что остались незаполненными — обведены более контрастным цветом.
Эти ваши светло-зелёные штуки выглядят не как маркеры, а как какие-то маленькие кнопки.
Эти ваши светло-зелёные штуки выглядят не как маркеры, а как какие-то маленькие кнопки.
Доработаная версия (для особо впечатлительных ;-) )
http://rc.foto.radikal.ru/0707/e8/bcc27773277e.jpg
Что скажете?)
http://rc.foto.radikal.ru/0707/e8/bcc27773277e.jpg
Что скажете?)
Вот две важных ссылки, касающиеся дизайна форм:
http://www.habrahabr.ru/blog/ui_design_a…
http://www.habrahabr.ru/blog/ui_design_a…
http://www.habrahabr.ru/blog/ui_design_a…
http://www.habrahabr.ru/blog/ui_design_a…
Кстати, я дико извиняюсь, просто в целях общего развития, как вы вставляете сюда картинки? Мне сказали что тут работают HTML теги, но как тока я пытаюсь что-нить замутить, типа ссылки или картинки, то оно просто не отображается. Что я делаю не так?(
Мне кажется, что лучше использовать стандартный вид всех input'ов. Если вы собрались делать "веб-два-ноль-первой-волны", посмотрите сначала на дизайн настоящих сайтов первой величины, того же фликера, например. И вы увидете, что там не используются эти "псевдогламурные" контролы. Вообще, я вижу тенденцию уменьшения лишней графики на сайте. К тому же, если вы действительно сделаете нечто первой величины, вы будете ломать голову над быстродействием. А та совершенно ненужная графика и js-код вам здорово насолят еще.
Есть соль в ваших словах. Выделываемся, собственно, пока можем. Как только наберутся с десяток миллионов пользователей, быстро перекроим все инпуты, и станем похожи на плоскорылый майспэйс, не к ночи будь сказано.
Проще сделать все сразу же проще. Вот представьте, я сижу на вашем сайте уже год, у меня кончился срок действия куки, и я решил заново авторизоваться. Нажимаю на знакомую кнопку и ничего не пониаю. "Где та гламурная форма? Я на том сайте? Я, наверное, не туда нажал..." и так далее. Как минимум, я войду в ступор. Начните задумываться об этом уже сейчас.
Ну можно например сбалансировать между нездоровым аскетизмом и аляповатостью :) То есть сделать гламурную форму стандартными методами :) Собственно там особо нестандартного разве только сабмит, да отсвет на полях. Отсвет впринципе можно заменить на рамки, будет конечно менее нестандартно,... зато более стандартно :D Сабмит я бы все же оставил таким какой есть. Кода там будут не километры, а меню приобретет свой шарм.
Я пошутил, конечно, а вы всё так близко к серцу. Майспэйсом (с точки зрения эстетики ресурса) быть не хочется.
А почему эта форма должна мне диктовать как мне заполнять форму. Я как особо ленивый индивид заполнив одно поле, нажимаю tab и перехожу к следующему. И в итоге нажимаю enter. Почему зная что я заполнил все формы правильно я должен после каждой ждать заветного зеленого цвета? А вот дальше более интересно: нажав кнопку "отправить", появилась бы новая страница на который бы мне сказали молодец, а если я сделал ошибку, например ввел 2 разных пароля, мне бы это сказали, при этом все валидные поля были бы удалены, как заполненые.
З.Ы. Не знаюможно ли сделать в вэбе2.0, но хочецца )
З.Ы. Не знаюможно ли сделать в вэбе2.0, но хочецца )
Может имеет смысл показывать тоьлко одно поле, а на кнопке выводить NEXT?
Над полем ввода можно вывести например "2/4", что означает второй шаг из четырёх.
Над полем ввода можно вывести например "2/4", что означает второй шаг из четырёх.
Зачем выводить подсказку "введите емейл" в статусной строке, когда у нас уже есть лейбл "Е-Ммейл", почему прямо там и не обозначить подсказки и прочии пожелания а не заставлять человека скакать глазами вверх-вниз? Однако это противоречит вашему изначальному замыслу, должен сказать (-:
/*Попутно родилась идея добавить функционала самой кнопке, выводя на ней подсказки*/
Не думаю однако что стоит крепко него/неё держаться.
Кроме того как правильно заметил illureal два месяца назад, такой надсмотр совершенно ни к чему (зачем?), слава богу живём в век мультизадачных операционных систем, когда *пользователь* управляет программами, а не наоборот. К тому же пользователи и так знают как обращаться с формами - заполнил поля, нажал ОК.
Плюс квадратики-прямоугольнички дублируют этого подсказчика внизу - все они говорят об одном и том же.
Что касается ника: поле для него - в самом низу; лично я хотел бы видеть его на самом верху чтобы сперва подобрать ник (может быть занят), а уж потом заполнять анкету. Проверка ника на занятость тоже не помешает, лучше автоматическая.
/*Попутно родилась идея добавить функционала самой кнопке, выводя на ней подсказки*/
Не думаю однако что стоит крепко него/неё держаться.
Кроме того как правильно заметил illureal два месяца назад, такой надсмотр совершенно ни к чему (зачем?), слава богу живём в век мультизадачных операционных систем, когда *пользователь* управляет программами, а не наоборот. К тому же пользователи и так знают как обращаться с формами - заполнил поля, нажал ОК.
Плюс квадратики-прямоугольнички дублируют этого подсказчика внизу - все они говорят об одном и том же.
Что касается ника: поле для него - в самом низу; лично я хотел бы видеть его на самом верху чтобы сперва подобрать ник (может быть занят), а уж потом заполнять анкету. Проверка ника на занятость тоже не помешает, лучше автоматическая.
Sign up to leave a comment.
Регистрация вверх тормашками