Представьтесь


Логин
Пароль
   Запомнить меня
Войти Зарегистрироваться   Забыли пароль?
Блог:

Веб-дизайн (20 записей)

О проектировании сайтов и других интерактивных сред.

Эквализация форм

0 баллов
Хочу продемонстрировать метод центральной эквализации на примере такой вот формы:



Демонстрирую:



Это кто ХИГ читал, тот поймет.

UPD: в комментах есть пояснение для тех, кто ХИГ не читал.

Инструменты: дельфи, фотошоп.
Написал  vitalykim | 17 марта 2009
Вы можете прокомментировать статью после регистрации или входа под своим паролем

Комментарии:

0
amfitrion18 марта 2009, 10:52
На вид весело. Дайте ссылку на ХИГ, чтобы почитать и понять.
0
vitalykim18 марта 2009, 13:40
0
vitalykim18 марта 2009, 13:40
http://developer.apple.com/documentation/userexperience/Conceptual/AppleHIGuidelines/XHIGLayout/XHIGLayout.html#//apple_ref/doc/uid/TP30000360-BEIBEAFJ
0
amfitrion18 марта 2009, 18:07
Ну не совсем веб конечно, а можно как вкраце, а то с английским не дружу, чем это пригодится в дизайне веб страниц?. Вроде бы это как с эргономикой связано больше.
1
vitalykim18 марта 2009, 23:28
Ну смотри глубже, Сань. Что такое форма, это визуальное воплощение такого процесса, который называется "добавление данных в базу". Формы есть везде. Веб в этом случае - это всего лишь один из способов доставки данных от формы к базе.

Форма на картинке принципиально не отличается от той, через которую добавляется коммент на этом сайте или от той, через которую народ регистрируется (замена диалогового окна на окно браузера не поменяет смысл). Это я просто дельфи использовал как инструмент для макетирования форм, поэтому наверное возник вопрос :-).

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

Например, почему текстовое поле "Имя" сделано и расположено именно так. Ширина текстового поля сделана больше, чем средняя длина имени для того, чтобы увеличить площадь активной зоны - чем больше площадь элемента на экране, тем быстрее мы доберемся до него курсором (и быстрее увидим его). Выравнивание по центру тоже не случайно, с центра одинаково быстро добираешься до обоих углов, в которых тоже есть какие-то элементы (вообще угол - хорошее место для того, чтобы около него что-нибудь расположить).

Причем существует приоритет выравниваний. Приоритет внутри группы объектов одного типа (например, меток "Имя", "Фамилия" и т.д.) выше приоритета внутри группы строчных блоков. Поэтому эплов
0
vitalykim18 марта 2009, 23:29
Поэтому эпловцы пишут "не выравнивайте все тупо по центру".

Обрезалось :-).
0
amfitrion18 марта 2009, 23:14
Ну вот давай если рубрика веб-дизайн, то и для всех делать именно по веб-дизайну форму и писать в постах тексты с пояснениями. Чтобы заинтересовать дизайнеров. Сам по себе пост интересный, но мудреный, его бы и изложить нашим дизайнерам красиво, чтобы поняли как формочки рисовать ИМХО.
-1
igor18 марта 2009, 18:33
все это безумно интересно, но предлагаю вам обсуждать подобные вещи в другом месте

Новые комменты

Облако меток

28
1
5
5
28
5
5