Кейс для сервиса логистики
- 2. Передначаломработы наддизайномсайтамы задаёмсявопросом,акакжедолжен выглядетьсайт?Какимондолженбыть?Какимиинструментамииприёмаминамследует пользоваться,аотчеголучшеотказаться? Чтобы ответить на этот вопрос достаточно обратиться к тенденциям в мировом веб-дизайне. ХХотямногиетенденциивдизайнемимолетны,некоторыеизнихявляютсяестественной эволюциейданнойотрасли.Мы выбралинесколькоключевых,нанаш взглядтрендов, актуальныхдля2015годаиприменимыхврамкахвашегопроекта. НАШ ДИЗАЙН LOCOMOTIV
- 3. Появившисьвнекоторыхотрасляхиндустрииу такихгигантовкакMicrosoft,GoogleиApple, тренд плоского дизайна находится на пике популярности. ЭЭтосвязанонетолькостем,какмыпользуемся контентомвСети,ноиссамойвебтехнологией. Плоский дизайн подчиняется принципам минимализма,чтовсвоюочередьприводитк сайтам простым,упорядоченным,быстрым и ориентированнымнасодержание. ТТакой подход не только эстетически привлекателен, но также очень практичен, позволяет посетителям взаимодействовать с содержанием иоцениватьего,ниначтоне отвлекаясь. 01.ПЛОСКИЙДИЗАЙН LOCOMOTIV
- 4. Исследования показывали, что большие размеры шрифтаспособствуютболеелегкому чтениювИнтернете. Крупнее становится не только текст — изображениятоже! ВВ 2015 году изображения будут в центре внимания благодаря новым интересным особенностям.Будутпоявлятьсяудивительные методы дляотзывчивогоизмененияразмера, извлечения основных цветов для фона и оптимизации изображений для минимальной нагрузкинасервер. ККрометого,основнойтенденциейв2015году будетиспользованиеизображенийвкачестве фона.Размытиеиразличныефильтрыпозволят тексту «плавать сверху» без ущерба для юзабилити. 02.БОЛЬШИЕИЗОБРАЖЕНИЯИТЕКСТ LOCOMOTIV
- 5. Каклюди(вид,получающий70-90%информации спомощьюзрения),мыусваиваеминформацию лучше,когдаонапредставленавграфическом виде, что и привело к популярности инфографики.Инфографика—простойспособ передаватьбольшоеколичествоинформациис высокойстепеньюусваивания. ВозниклаВозниклановаятенденция.Вебграфика!Каки инфографика, вебграфика также передает большиеобъемы информации,новключаетв себя интерактивные элементы, которые позволяют пользователю физически взаимодействовать с информацией. Она визуально привлекательнее инфографики и значизначительно увеличиваетстепень усваивания информациипользователем. Следует ожидать роста популярности вебграфикииеёутверждениявкачествеодного из основных компонентов современного веб-дизайна. 03.ВЕБГРАФИКА/ИНФОГРАФИКА LOCOMOTIV
- 6. “Микровзаимодействия — это маленькие элементыфункциональности.Фокуснанихочень важен.Качестводизайнапродуктаопределяется качествомегосамыхмелкихдеталей.” ДэнСаффер Например,Например,поведение виджета подписки на рассылку. Он может слегка подрагивать, напоминаяосоответствующейвозможности,и успокаиваться после того, как им воспользовались.Такойвиджетнетольколучше выполнитсвоюфункцию,ноипоможетоживить статичныйнапервыйвзглядвебсайт. ЕЕщеодинпример— автозаполнениеименина основеe-mailприрегистрации. Иконкаприложения-часовпоказываеттекущее время.Выпроводитепослайдеруразблокировки экрана.Маленькийиндикаторпоказывает,что ваш друг вышел в онлайн. Всё это — микровзаимодействия. 04.МИКРОВЗАИМОДЕЙСТВИЕ LOCOMOTIV
- 7. Не так давно The New York Timesсделали редизайнсвоегопортала,очемгромкозаявили публике,ионипопаливтренд,таккаксделали егопроще,эргономичнее,выставиливпередто, чтоонихотятпредложить,обеспечивбольший комфортработыпользователям. ВВоформлениинепоявилосьничегонового,в планедизайнерскихтрюковивозможностей,но мы думаем,чтовсебольшеибольшесайтов, особенно ориентированных на обилие содержимого, последуют этому примеру, предпринявтакойлогичныйследующийшаг. ДосДостаточносброситьвсюмишуруисодержимое засияет,позволяядизайнупорталавыполнять егонастоящуюроль,анеперетягиватьнасебя вниманиепользователя. 05.УПРОЩЕНИЕСАЙТОВИФОКУСНАСОДЕРЖИМОМ LOCOMOTIV
- 8. Прототипирование помогает нам в процессе создания качественных пользовательских интерфейсов.Мысоздаёмпротитпдлятого,чтобы сэкономитьвремяразработкипроектаисократить число доработок, которые возникают при несоответствии функционала сайта ожиданиям заказчика. НачинаемНачинаемсанализаконтента,изчегополучается структурабудущегосайта.Детализацияинтерфейса идругиемелочиздесьненастольковажны,основная цельнаэтомэтапе–построитьграмотнуюструктуру длявзаимодействияспосетителем. Нашитребованиякпрототипамсайта: -Быстроесозданиепрототипа -Лег-Легкостьвнесенияизмененийвпрототип -Интерактивность -Детализация(вотдельныхслучаях) При работе над прототипами мы пользуемся старыми-добрыми методами макетированиянабумаге,отрисовкоймакетоввручную и,дляпрезентацииклиенту используемпопулярныепрограммныепродуктыдляпрототипированияинтерфейсов. 06.ПРОТОТИПИРОВАНИЕИНТЕРФЕЙСА LOCOMOTIV
- 9. Каждыйизэтихэлементовможноинужноиспользовать приразработкедизайнаВашегопроекта. Это ключевые моменты, которые позволят оптимизироватьсайт,выдвинутьнужнуюинформацию напереднийплан,датьпользователю то,зачем он пришёлнасайт. НашаНашазадача-определитьцель,выявитькратчайший путь,чтобы привести пользователя к желаемому результату,определить концепцию будущего сайта, выстроитьегоструктуруивоплотитьвсюпроделанную работу в пользовательский, дружественный, интерактивныйиэффективныйдизайн.Дизайн,который будетработатьнавас. ЭЭтоиестьнашейглавнойцелью. ВЫВОД: LOCOMOTIV