Записки с меткой «Инструменты, ресурсы»

Сайт украинской компании делающей полезные приложения для мак-пользователей с понятными и приятными интерфейсами.

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

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

Работа над любым проектом, будь это интерфейс сайта или приложения для мобильного телефона, начинается с проектирования. В области разработки интерфейсов этот процесс принято называть прототипированием. Для разработки небольших сайтов состоящих из двух-трёх страниц или интерфейсов состоящих из нескольких экранов достаточно хорошо заточенного карандаша и бумаги. Для больших же проектов, особенно если нужно показать прототип клиенту в понятном виде да ещё с интерактивом, нужны инструменты посерьёзнее. Ниже перечислю несколько программ которые могут стать хорошими инструментами для проектировщика.

Adobe Illustrator

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

Adobe Photoshop

Растровый редактор который больше подходит для создания окончательного варианта интерфейса. Панель Layer Comps позволяет запоминать различные состояния слоёв (отключение видимости, положение, стиль) что позволяет сохранить в одном файле несколько состояний интерфейса и демонстрировать некий интерактив. Большинство веб-дизайнеров работают в этой программе.

Axure RP Pro

Программа разработана специально для прототипирования интерфейсов и позволяет генерировать интерактивные макеты в виде набора html- файлов которые потом можно демонстрировать клиенту. В библиотеке содержатся все необходимые элементы интерфейса, что позволяет довольно быстро создать прототип. Но опять же, для создания окончательного макета прийдётся начинать всё заново в другой программе, да и сама программа мне показалась несколько недружелюбной. Чуть больше о программе можно узнать из статьи «Основы проектирования веб-интерфейсов в Axure RP Pro«.

Adobe Fireworks

Довольно старая программа, этакий гибрид Photoshop и Illustartor, была разработана в ныне поглощённой монстром Adobe компаниии Macromedia. В Fireworks можно использовать растровую и векторную графику, создавать различные состояния элементов интерфейса (используя стили, страницы, слои, состояния) и демонстрировать клиенту как это работает, использовать символы и много чего ещё. Таким образом программа позволяет создавать интерфейс от прототипа до окончетельного макета не прибегая к другим инструментам причём все, начиная от проэктировщика и заканчивая дизайнером, могут работать с одним документом. Более подробно о возможностях программы можно узнать из статьи «Проектирование интерактивных продуктов в Fireworks«. Лично я склоняюсь к тому чтобы начать использовать именно эту программу.

На сайте thenounproject.com собрано огромное количество знаков и условных обозначений котрые можно свободно скачать. Это просто праздник и шкатулка с сокровищами для дизайнера.

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

Очень правильно и удобно начинать проектировать сайт с бумажных эскизов. Читать и смотреть дальше…