Всем привет!
Этим постом я открываю цикл статей про использования Adobe Illustrator в веб-дизайне. А именно в использовании его при работе над интерфейсами. Статьи постараюсь выстраивать в виде пособия — сначала будет информативная часть, некие рассуждения на тему преимуществ и недостатков. Потом будет рассмотрена подготовка рабочего пространства. Ну а затем пойдут практические занятия и примеры. Попытаюсь быть максимально точным и не скупится на иллюстративный материал — прикладывать понятные скриншотики и т.д.
Буду рад комментариям по делу. Именно касающихся практической стороны дела. Холивара не надо.
За сим прощаюсь. Ждем первый пост о том как в Илюстраторе все круто и удобно.
Пока.
Вот уже через несколько часов мир увидит новое детище Apple. Сделаем несколько предположений о том, что же это и с чем его едят.
1. Новое творение будут звать iPad 2. Экран гаджета будет диагональю 11 дюймов 3. Работать будет под управлением iPhone OS 4. Сможет звонить как телефон 5. Будет поддерживать сети-3G 6. Разрешение экрана будет 1024×800-pixel
О чудо! Есть оказывается ещё круче плеер — это настоящий iTunes, только написанный на flash.
Представляю Вам GROOVESHARK
↓
↑
Работает очень круто! Настоящий онлайн-комбайн музыки…
Приятного прослушивания.
Интернет просто чудовищная вещь. Благодаря ему теперь можно не хранить безумную mp3-коллекцию на винте. Раньше я ей так дорожил, систематизировал, прикреплял обложечки… А она росла и жрала место. Жрала и жрала — настоящая ненасытная тварь. Но я сказал: —Хватит! Зафига я плачу за интернет? Подумал я, и решил найти сервис, который всегда и везде позволит мне слушать мою любимую музыку, ну и плюс любую другую музыку.
Недолгое время я пользовался Веборамой — она более-менее юзабильная, но все же некая тупорогость в ней присутствует. Да и перенасыщеность фичами, которые мне совсем не нужны — тоже напрягала. И вот, свершислоь! Ура! Наконец-то я нашел сервис, который я так долго искал. Благодаря всеми любимому Хабру мы встретились.
Простой и удобный сервис для слушания музыки. Вот это именно то, что я искал. Музыка и ты… и все. Сижу, работаю, слушаю.
Еще одно доказательство мегапопулярности твитера, это то что в рейтинга блогов Яндекса мой твитер-блог http://twitter.com/alexsas_ стоит на аж 40 894 месте. А автономный блог http://alexsas.ru/blog всего лишь на каком-то 2 299 524 ! Поразительная разница.
Идея созрела очень давно, но реализовать её я мог только с помощью художника. И такой человек нашелся! Рад представить вам Хытмана, который любезно нарисовал главные две детали в этом дизайне. Еще раз большое спасибо ему за это.
Запускаю новую рубрику в блоге — ИДЕЯ. У меня рождается много идей в процессе жизни. И я их как старая бабушка складываю в сервант. Складываю, складываю… А какого ХУЯ? Блять только 0,5% из количества этих идей находят воплощение. А я их складываю и складываю. Как самый последний жид. Можно подумать я самый умный, никто этого больше не придумал… ХРЕНУШКИ! Так нахуя их складывать? Всё решено. Теперь в блоге я делюсь своими идеями.От самых банальных до самых мега как бы крутых. Ждите. Идеи выстроились в очередь и ждут пока я их вам выложу.
Как-то я поведал о том, что занимаюсь обливанием. За вчера и сегодня в Бишкеке выпало очень много снега. Я подумал, что это хороший шанс повысить планку в оздоровлении своего тела и души.
Раздеваеюсь до трусов. Одеваю банный халатик. Выхожу за ворота, где лежат большие кучи снега, сделанные мной же при расчистки близ лежащей территории. Снимаю халатик. Долго не думаю. Ложусь в сугроб на животик. Чувствую приятную прохладу. Переворачиваюсь на спинку. Нагребаю снега себе на ноги и на живот. Еще раз переворачиваюсь. Встаю. Стряхиваю с себя весь снежок. Подхватываю халатик и бегу домой.
В недавнем своем посте про влияние возраста на вкусы в еде, я писал о том, что полюбил много чего с течением времени. Осталась только икра… Поздравьте меня! Преодолен и этот барьер. Икра Сига, купленная женой, очень пришлась по вкусу.
12 февраля 2008 Слова «Будь проще» могут интерпретироваться по разному. А особенно слово «проще».
Для одних проще нажать на клавиатуре, для других — тыкнуть мышкой. Но если речь идет об интерфейсе, который пользователь видит в первый раз — проще тыкнуть мышкой. Ведь, что надо нажать, пользователь не знает, а на что надо тыкнуть видит. Поэтому хорошие программы позволяют пользователю настраивать клавиши как ему вздумается.
Фотошоп очень долгое время грешил этим — до CS-версий в нем нельзя было менять шоткаты. С Илюстратором такая же ситуация, но не с шоткатами, а вообще с интерфейсом — он был вообще не нагляден и неудобен. Неудивительно, что на просторах СНГ популярность завоевал Корел. Секрет прост — с ним проще работать. Вообще илюстратор спас Постскрипт и PDF. Сейчас ситуация меняется в лучшую сторону, но до Корела ему еще далеко (в плане интерфейса конечно. о «деле привычки» я не говорю)
Вернемся к простому пользователю. При разработке интерфейса закон прост — выбирается самый неподготовленный пользователь и под него проектируется интерфейс. Попробуйте разрабатывать интерфейс скажем для своей мамы (если она у вас не администратор баз данных конечно). Ваши сайты и программы сразу станут добрыми, отзывчивыми и главное простыми.
А теперь вернемся еще на шаг назад. Что стоит перед разработкой любого программного продукта? Да. Это магическое словосочетание «Техническое Задание». Вот здесь, чаще всего, важно быть простым и понятным. Вы знаете, кто подписывает ТЗ? Не админ сайта, это уж точно. Он струсит. Подписывает ТЗ Иван Васильевич Бизнесменов — Ваш заказчик. Он реально не знает, что такое PHP, «восстановление сессии» или что, оказывается, «коннектор к БД лежит вне зоны www». Ему, человеку который вам заплатит за работу, абсолютно поровну, напишите вы его сайт на Рабионрейлс или же на Питоне. Он не задаст вам вопросов, он не захочет показаться глупым, он все поймет по своему и подпишет. А когда вы представите ему готовый проект — он все равно скажет, что вы сделали не так, как он думал. Вы будете тыкать ему ТЗ. И возникнет конфликт. А конфликт это всегда плохо. Поэтому ТЗ должно писаться обычным «маминым» языком с прилагаемым макетами всех экранов. Чтобы дядя Ваня видел, что же он в итоге получит.
А какими библиотеками пользоваться при разработке решать вам!
Продолжим говорить о простоте и том, как это важно. В предыдущей статье я приводил примеры не связанные с интернетом. Пришло время это исправить.
Давайте возьмем в пример монстров, а именно: Яндекс, Гугэл и Яху. Но возьмем их не сейчас, а много лет назад во времена их становления.
И так 1998 год.
Первый рассмотрим Яндекс. Тогда он был вот таким:
В принципе все просто. Но не забывайте, что на дворе стоит 98 год. В интернете одни программисты. А поисковая система… она же для всех – о чем и повествует баннер Яндекса. Но для всех это темный лес и зайдя на страничку люди начинают читать, понимать, вникать.
Смотрим на Яху.
Мне кажется это вообще провал. Взгляд не может зафиксироваться. Куча ссылок. Что это??? а-а-а!
Теперь Гугэл:
Тут получше, разбили табличку цветом и ссылок намного меньше, чем у первых двух. Но в конце 98 года Гугэл меняет дизайн, и он предстает нам почти таким же, какой и сейчас.
Вот, как мне кажется, один из важнейших залогов успеха этого поисковика. При работе с этим интерфейсом вопросов почти нет, даже у самых ламеров.
Реанимирую свой цикл статей по поводу простоты дизайна. Во-первых: для того чтобы они жили в моём блоге. Во-вторых: готовится очередная статья и чтобы не терять целостности соберу все статьи под одну крышу.
Со некоторыми моими суждениями я уже не согласен, но материал не теряет своей ценности.
Будь проще I 20 декабря 2007 года
Решил я, наконец, поделиться своими мыслями по поводу тенденции построения пользовательских интерфейсов, а также дать какие-то свои рекомендации по этому поводу.
Основной тезис статьи — «Будь проще». Я считаю это основное правило, которому должен придерживаться разработчик при построение интерфейса для большого круга пользователей, и рассчитывающий на популярность. Еще одна главная мысль статьи — «Простой интерфейс сделать гораздо сложней чем сложный» Далее я попытаюсь все это доказать. ↓ С древних времен человек пытается упростить себе взаимодействие с окружающей средой. Возьмем простой пример — надо выкопать яму. Перечислим и прокомментируем все варианты копание ямы: Копать руками. Построить данный интерфейс очень просто (делать вообще ничего не надо) но копать таким инструментом очень сложно. Копать палкой. Что требуется: найти палку. Руки уже болеть не будут но копать тоже не очень то удобно. Лопата. Сделать лопату еще сложней, чем палку, но копать ей уже поприятнее. Экскаватор. Экскаватор сделать очень сложно. Но копать уже совсем легко. Конечно же надо еще учитывать то, что бы цель оправдывала средства. Зачем гнать экскаватор, если ямка должна быть в 5 см? Тут и палка может сойти. Еще приведу любимый пример со смесителями в ванной. Сначала он был такой:
Нужно было очень долго каждый раз крутить, то один, то другой вентиль, чтобы добиться нужной температуры. Спустя некоторое время люди изобрели так называемый «полуоборотный» смеситель:
У него вентили крутились только на 180° градусов. И добиться нужной струи приемлемой температуры стало проще Но самое крутое изобретение случилось еще некоторое время спустя.
Это джойстиковый смеситель:
Теперь стало все просто и удобно. Одним движением можно настроить и силу струи и температуру. И когда выключаешь… включить можно с той же самой температурой. В общем сказка, а не смеситель и очень прост в использовании. Но очень сложен в изготовлении, и еще сложнее было его придумать Это еще раз доказывает, что разработка простого для понимания и легкого интерфейса — очень сложная задача. Простой интерфейс — залог успеха. Вот еще один пример:
Все узнали — это iPod. Надо отдать должное разработчикам, они создали настоящий шедевр в мире плееров. За всей кажущейся простотой скрывается очень многое… я допустим офигел когда узнал, что этот джойстик еще и тач-пад одновременно… супер. Тоже самое произошло и с iTunes Успех интерфейса зависит от поведения пользователя при использовании данного интерфейса. Чем меньше у человека возникает вопросов при взаимодействии с интерфейсом, тем удачней интерфейс.
Поговорим, о картах или схемах проезда. Они присутствуют почти на каждом сайте. Их делают красивыми:
или так
а сейчас, очень популярен стал вот такой метод:
Сама по себе карта очень хорошая вещь, но в поиске офисов ей явно не хватает информативности. Найти требуемое пересечение очень легко. Как говорится: язык до Киева доведет. А вот найти именно то здание, а в нем нужный подъезд, чаще всего гораздо сложнее.
Для удобства, предлагаю располагать на страницах «Контакты», вместе с картами, еще фотографию здания в котором находится конторка,
или ориентиры:
Это будет очень хорошим подспорьем юзеру в поиске вашего офиса. Будьте доступнее!
Mail.ru проводит гипер акцию «Напиши письмо Деду Морозу». Я там оставил и своё желание. Потом решил заглянуть в рейтинг и увидел на вотором! месте такого же, как я Сашу, с таким же, как у меня желанием. На втором месте вы представляете? Меня это очень удивило… значит и у меня есть шанс. Всегда прикольно помечтать. Загадывайте желания и пусть они сбываются и пусть это будет для вас неожиданным, но всегда приятным сюрпризом! Всех с Новым годом! Всем добра — его очень мало осталось! Привет Деду Морозу — я в тебя верю. )
Update: Оказывается место не второе — он просто написал письмо вторым. Считаю это вообще не справедливо — естесвенно, если он на первой странице всегда болтатся, то и будет мега популярным. Так вот — шансов у меня нет :) Но, это не повод не мечтать.
