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

Color Scheme Designer

• Описание: позволяет подобрать цветовые схемы сайта и сохранить их для дальнейшего использования
• Стоимость: бесплатно
• Ссылка: http://colorschemedesigner.com

Почему этот ресурс может быть вам интересен: Если вы создаёте веб-сайт (а кто сейчас этим не занимается?), то вам необходимо подобрать тему для него. При этом так может случится, что вы не сильны в стилистике и плохо разбираетесь в цветах, оттенках и стилях. В таком случает лучше знать парочку инструментов под эти цели, которые можно использовать при разработке сайта. Они помогут в подборе цветовой гаммы проекта. Один из таких ресурсов – ColorSchemeDesigner.com – действительно, отличный инструмент, который помогает вам правильно подобрать цвета.

Комментарий: этот ресурс позволяет вам видеть номера цветов, варьировать насыщенность цвета, яркость, контрастность, просматривать превью сайта с данной цветовой гаммой. Кстати, в блоге я уже рассматривал данный проект, поэтому в статье про Color Scheme Designer можете почитать о нем чуть более подробно, посмотреть картинки и т.п.

CSS Sandbox

• Описание: позволяет проводить эксперименты с CSS-стилями в реальном времени
• Стоимость: бесплатно
• Ссылка: http://aurelio.net/css-sandbox/

Почему именно этот ресурс: На то есть пару причин: игрушка, учитель, наглядная демонстрация, быстрое отображение изменений, веб-приложение, всего одна HTML-страница. CSS Sandbox может быть описан несколькими предложениями. Это простая и быстрая в действии веб-игрушка, которая позволяет Вам экспериментировать с CSS в режиме реального времени. Просто кликните на один из элементов CSS, чтобы увидеть мгновенный результат. Никаких перезагрузок страницы. Быстро и весело!

Как только Вас удовлетворит полученный стиль, подведите курсор мыши к значку <Код>. Появится панель, содержащая все необходимые CSS-коды для добавления этого форматирования на Ваш веб-сайт.

Typetester

• Описание: позволяет сравнивать типы шрифтов для экрана
• Стоимость:  бесплатно
• Ссылка: http://www.typetester.org

Почему он:  Typetester – это он-лайн приложение по сравнению шрифтов для экрана. Его основная задача – сделать жизнь веб-дизайнера проще. По мере того, как в операционную систему загружаются новые шрифты, список шрифтов будет обновляться.

Комментарий: в Typetester Вы также можете получить CSS-код для понравившегося стиля, используя вкладку Tools и опцию Get CSS for 1-st/2-nd/3-d column.От CSS Sandbox отличается тем, что позволяет одновременно сравнивать несколько типов шрифтов в разных колонках.

Genfavicon

• Описание: позволяет конвертировать изображение в favicon для Вашего сайта
• Стоимость: бесплатно
• Ссылка: http://www.genfavicon.com/

Зачем выбирать этот сервис: Сайт Genfavicon использует приложение, которое позволяет вам создавать файл .ico из любой картинки на Ваш выбор. Просто укажите адрес изображения в строке URL или загрузите его на сервер Genfavicon. Затем выберите ту часть изображения, из которой Вы будете делать favicon перетаскивая мышью выделенную область. После этого Вы должны указать размер Вашего значка favicon: 16X16, 32X32, 48X48, 64X64 или 128X128. Просмотрите полученный результат в окне Favicon Resulting и завершите процесс создания значка.

Вы можете использовать созданный значок для Вашей странички или разместить его в любом месте, где захотите. Создание favicon  никогда не было таким простым. В три шага Вы создаёте значок .ico, который Вы легко можете вставить на свой сайт.

CrazyEgg

• Описание: дополняет Вашу аналитику визуальными данными об активности и действиях посетителей.
• Стоимость: от 9$ в месяц
• Ссылка: https://www.crazyegg.com/

Зачем этот ресурс: Обычные средства аналитики дают Вам статическую интерпретацию данных об активности посетителей Вашего сайта. Вы можете сказать, сколько людей посетили Ваш сайт или просмотрели конкретную страницу. Но Вы не сможете оценить эффективность отдельных элементов дизайна, расположения ссылок или популярность разных зон Вашего сайта. Если Вы хотите знать, в каких именно местах Вашего сайта люди кликают, и какие зоны сайта нуждаются в улучшении, то Вам может быть полезен CrazyEgg. CrazyEgg делает действия посетителей видимыми для Вас.

SurFTP

• Описание: он-лайновый FTP-клиент для Вашего сервера
• Стоимость: бесплатно
• Ссылка: http://surftp.com/

Почему ресурс интересен: После того, как Вы зарегистрируетесь на сайте, Вы сможете: управлять содержимым FTP-сервера, загружать/выгружать файлы, архивировать/деархивировать файлы, устанавливать ПО, копировать, перемещать и удалять файлы, копировать или перемещать файлы на другой FTP-сервер, переименовывать файлы и изменять права доступа пользователей к файлам.

Snipplr

• Описание: публичный репозиторий для сниппетов (фрагментов кода)
• Стоимость: бесплатно
• Ссылка: http://snipplr.com

Чем именно интересен: Snipplr – это открытый репозиторий для исходного кода, который предоставляет Вам место для хранения и организации всех небольших кусков кода, которые Вы используете каждый день. Но прежде всего этот ресурс позволяет Вам делиться сниппетами с другими программистами и дизайнерами. Исходные коды – вообще штука очень полезная, позволяющая иногда сэкономить множество времени.

P.S. В качестве моего личного комментария к посту, в принципе, и добавить то нечего – все сервисы по своему интересны и могут применяться в работе. Также, наверное, следует зайти на оригинал с которого делался перевод – это статья 25 Essential Web Services for Designers, поскольку там представлены чуть больше ссылок на сайте. Всего автор рассмотрел 25 интересных веб проектов, мы привели лишь часть из них, так сказать, наиболее интересные, но для общего развития можно бегло оценить остальные. Кроме того, определенная часть подборки представляет собой платные ресурсы, поэтому тут уже нужно взвешивать насколько полезным будет тот или иной сервис и достоин ли он соответствующих финансовых затрат.

P.P.S. Если сравнивать с продвижением эффективная контекстная реклама может привести чуть больше клиентов, но эффект раскрутки более продолжителен.
Интернет магазин Линзмастер предлагает в ассортименте контактные линзы и различные аксессуары к ним, заказать можно быстро, доставка по Украине.

© Вебдванольные заметки, 2011. | Комментариев - 5 | Категория Дизайнерам.

Интересные статьи по теме

• Социальная сеть il Conte для дизайнеров (2)
• Color Scheme Designer – онлайн сервис создания цветовой палитры сайта (7)
• Функциональный и удобный онлайн аудио редактор Myna (6)
• Фавиконка своими руками, сервисы создания favicon онлайн (31)
• Сервис Freetwitterdesigner – создание фона для twitter (1)

Можно сказать, что Seeklogo это что-то вроде поисковой системы по логотипам. В индексе сервиса находится более 200.000 векторных логотипов, в том числе, охвачено подавляющее число общеизвестных брендов! Функционально Seeklogo не предлагает никаких премудростей. Они, собственно, лишние — как и в любом другом поисковике вы просто вводите в строку поиска свой запрос и получаете результат.

Не нравится стандартный метод поиска? – тогда можно воспользоваться каталогом (по алфавиту или популярным тегам), которые расположены сразу под строкой поиска. В любом случае вы практически наверняка найдете то что ищите! Как и полагается облаку тегов – наиболее популярные темы выделены бОльшим шрифтом.

Результаты поиска представлены в следующем виде:

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

Большинство представленных в Seeklogo логотипов имеют формат «EPS», но попадаются в достаточно большом количестве и файлы «CDR» (Corel Draw), а так же «Al» (Adobe Illustrator). Для того чтобы скачать логотип нужно только ввести капчу! В целом, следует признать, что не так часто попадаются сервисы которые столь просты по сути, и одновременно столь важны. Любой дизайнер, наткнувшись на Seeklogo не оставит сервис без внимания. Это настоящее сокровище для разработчиков логотипов и тех, кто постоянно с ними сталкивается.

P.S. Чтобы начать бизнес в сети заказывайте создание сайтов или корпоративного портала у профессионалов – компании Delta-x.
Если ваша фирма из Киева, то качественный хостинг украина подойдет как нельзя лучше, и по расположению серверов, и по ценам.

© Вебдванольные заметки, 2011. | Нет комментариев | Категория Дизайнерам, Картинки / фото, Поисковые системы.

Интересные статьи по теме

• Где взять картинки для блоггера? – Wylio знает! (5)
• Уникальный поиск по изображениям Tineye (13)
• Поиск обоев (wallpapers) с помощью Google Image Search (5)
• BePic – оригинальная галерея качественных HD фоток (1)
• Электронная библиотека BookFinder, поиск книг онлайн (2)

Называется он Ретрофото.Ru (retrofoto.ru) – новая жизнь старых фотографий. Вообще, если честно, когда я запланировал публикацию на прошлой неделе и впервые увидел проект, то подумал, что это просто архив старых фотографий Москвы. С первого взгляда проект запал в душу своим содержимым и реализацией. И только сегодня я обнаружил, что это фотобанк. Ретрофото.Ru специализируется на продаже старинных фотографий Москвы и других городов. Они, по сути, связывают обладателей коллекций старых фотографий (стеклянные негативы, пленки, черно-белые фото) и покупателей, то есть выступают в роли посредников (как, в принципе, и любой другой фотобанк). Ретрофото.Ru – просто удобный инструмент для авторов изображений, которые самостоятельно могут загружать их в базу, а покупателей имеется возможность скачивать нужные им фотографии старого города,   его улиц,  переулков и домов. Обычным же посетителям вроде меня, можно просто наслаждаться красивыми и столь забытыми видами ретро фотографий.

Сложно сказать какие именно эмоции вызывают подобные изображения – вроде это не ностальгия, поскольку я тогда еще не родился, скорее удивление и немного изумления от «прикосновения к истории». Причем это прикосновение (ощущение) кажется весьма реальным, знаете, это не все равно, что листать сухие книги, читать структурированные тексты и поглядывать на скупые иллюстрации, здесь все по-другому. Авторские старинные фотографии на Ретрофото.Ru создают какой-то «эффект присутствия» что ли. Короче говоря, объяснить сложно, посмотрите архив фотографий, возможно, вы поймете, что я хотел сказать:) Хотя, в принципе, каждый может найти в этом что-то свое.

Сайт сделан очень красиво, качественно и функционально. На главной вы найдете флеш ролик с выбранными изображениями, справа располагаются последние и лучшие старые фотографии на проекте. Чуть ниже – список последних комментариев, вы можете оставлять свои записи после регистрации. Дабы как-то структурировать все изображения на Ретрофото.Ru есть разбиение по категориям:

• Неопознанное
• Улицы, проспекты
• Переулки, проезды
• Площади
• Памятники
• Мосты, набережные
• Церкви, монастыри
• Транспорт, вокзалы
• Бульвары, парки
• Рестораны, сады
• Люди, персоналии
• Интерьеры
• Усадьбы, дачи
• Промышленность, торговля
• Кремль, учреждения

Пройдя на страницу категории получим список фотографий.

Здесь можно отсортировать их по некоторыми критериям (новизна, рейтинг), а также задать количество отображаемых старинных фотографий на одной странице. Есть в этом «пристанище истории» и новомодные тенденции – вы можете подписаться на обновления архива по RSS (как целого, так и по категориям). Страница с единичным изображением содержит кроме самой старой фотографии ее название, описание и некоторую другую информацию.

В целом, проект оставляет очень приятное впечатление. Пусть он и создан с коммерческими целями, но выглядит так, как будто в него вложили душу – а это радует. Даже, если вы ничего не собираетесь покупать, приглашаю просто посмотреть красивые старинные фотографии, особенно будет интересно жителям Москвы, так как этому городу уделено центральное внимание. Вообще Ретрофото.Ru вызывает желание создания подобного архива для других городов (в частности украинских, т.к. мне это ближе). Кстати, нечто подобное существует в одном из сообществ ЖЖ – вызывает исключительно положительные эмоции.

P.S. Постовой. Покупаем духи в интернет магазине, доставка по Украине бесплатная.

© Вебдванольные заметки, 2009. | 1 комментарий | Категория Дизайнерам, Картинки / фото.

Интересные статьи по теме

• Flickr – самый продвинутый и популярный фотохостинг (4)
• Страна.ру — онлайн путеводитель по России (0)
• Составляем фоторобот с помощью сервиса Flash Face (1)
• Сервис twitpic – добавляем изображения в твиттер (5)
• Сервис Freetwitterdesigner – создание фона для twitter (1)

Также общим является то, что все сервисы работают в вашем браузере и доступны онлайн из любой точки земного шара в любое время. Не нужно устанавливать программы, покупать лицензии, беспокоиться о количестве свободного места на жестком диске и т.п. Просто зарегистрируйтесь в на Aviary, после чего получите доступ к таким онлайн инструментам.

Phoenix – мощный онлайн графический редактор, которые справится как с простой правкой вашего изображения, так и может работать со сложными эффектами. Он содержит практически все базовые и ключевые возможности десктопных графических редакторов. Здесь есть возможность использовать кисти, заливку, выделения (даже магическое лассо или как там оно называется), убирать текущее действие (undo), поддерживаются слои, группы и маски. Приложение имеет интуитивный интерфейс, управление производится с помощью мышки. Есть возможность поделиться своими работами с другими, изучить обучающие материалы, импортировать изображения из Flickr, Picasa, Facebook, а также использовать результаты труда в других сервисах Aviary.

Raven – онлайн векторный редактор. Позволяет создавать векторные изображения для логотипов, дизайна футболок и т.п., авторы утверждают, что второго такого инструмента в сети просто нет. Raven поддерживает работу с кривыми, объектами, цвет, градиенты, доступны также слои, маски, импорт файлов scalable vector graphics (SVG). Как и для предыдущего сервиса доступно изучение обучающей документации, импорт изображений из Flickr, Picasa, Facebook и, конечно же, совместимость результата со всеми приложениями от Aviary.

Peacock – визуальная лаборатория или редактор эффектов. Название у проекта не случайное ибо он позволяет вытворять с изображениями просто нереальные вещи. Сложно описать словами что именно делает Peacock, тут вам в большей степени поможет видео, расположенное ниже, тем не менее, попробую. Данный инструмент позволяет комбинировать и соединять изображения (ресурсы) с некоторыми эффектами и контроллерами. На выходе вы получаете результат всяческих преобразований  – визуально похоже на Yahoo Pipes, но только для картинок и дизайнеров.

Falcon позволяет быстро «захватывать» изображения и веб страницы, изменять их размеры, обрезать ненужные части изображения, вращать и т.п. Используется и работает в виде плагина для Firefox. Кстати, приложения также дает возможность узнавать цвет на странице браузера как это делает плагин Colorzilla. Если я правильно понял из описания, то этот инструмент идеально подходит для создания различного рода скриншотов, потому что у вас есть возможность добавлять и вносить некоторые правки в рисунок. Пока что я всей обработкой занимаюсь в фотошопе, но, по сути, использую лишь его примитивные функции. Поэтому, если все это можно будет делать непосредственно в браузере и «на лету», то Falcon задержится у меня надолго:)

Toucan – еще один полезный для дизайнеров инструмент, он отвечает за работу с цветом, для создания палитры. Если вы читаете блог не первый раз, то могли уже видеть подобную реализацию в проекте Color Scheme Designer. Здесь есть множество различных способов для создания палитры – из стандартного элемента выбора цвета, из специального круга цветов, где содержатся несколько точек, связанных определенным правилом (похожие, противоположные цвета), есть даже выбор цветов из загружаемого изображения. Сохранив результаты работы в своем профайле, позже вы сможете открыть картинку в других приложениях – Phoenix или Peacock.

А вот и небольшое видео по всем сервисам от Aviary сразу:

Если вы зайдете в разделы для каждого приложения, то найдете там отдельно видеоролики с обзором конкретного инструмента. В целом, лично мое впечатление от увиденного можно частично описать восторгом, создатели постарались действительно на славу. Разработка будет полезна многим людям, которые работают в интернете – от дизайнеров до блоггеров, а также не стоит забывать про онлайн аудио редактор Myna. В общем, Aviary пригодится всем, кто занимается созданием чего либо, по-моему, у них в видео где-то была фраза, что сервисы нужны «for creators». Поэтому, если вы один из них – обязательно загляните!

P.S. Постовой. Полезное – реклама и раскрутка сайта для привлечения посетителей.
Интересное почитать – история чая в Китае, России и Европе.
Качественный офисный переезд – аккуратно и оперативно.

© Вебдванольные заметки, 2009. | Комментариев - 4 | Категория Дизайнерам, Картинки / фото.

Интересные статьи по теме

• Сервис Freetwitterdesigner – создание фона для twitter (1)
• Яндекс краски – нарисуй свою открытку (15)
• Фавиконка своими руками, сервисы создания favicon онлайн (31)
• Социальная сеть il Conte для дизайнеров (2)
• Ретрофото.Ru – старые фотографии Москвы и других городов (1)

Понятно, что человека «машина» никогда не заменит в таком творческом процессе как создание дизайна, но помочь может. Причем, как часто бывает, программа может сгенерировать и продемонстрировать конечный результат за несколько секунд – не нужно полдня сидеть и компоновать разные цвета в надежде найти идеальный вариант. Я уже не говорю как удобно было бы общаться с клиентом о цветах будущего сайта, имея под рукой Color scheme designer.

Итак, как же работает данные онлайн сервис. Все происходит в пределах «одного экрана», не требуется никаких переходов по страницам и переключений. Реализация проекта – на высшем уровне.

Первым шагом вы должны выбрать цветовую модель будущего дизайна. Имеется несколько вариантов – от монотонного до различных вариаций (комбинаций) теплых и холодных оттенков.

Сразу под моделями решений имеется палитра цветов. В зависимости от выбранного количество различных составляющих на палитре определяются конкретные цветовые решения. Например, схема – analogic, в которой есть один центральный цвет и два второстепенных, одинаково отдаленных от него в разные стороны (см. рисунок выше).

Следующим шагом является изменение яркости и контраста. Кроме ручной настройки есть предварительно подготовленные стили – preset по типу «средний контраст», «темный сайт», «пастельные тона» и т.п.

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

После этого возвращаемся в левую колонку – закладка «scheme info», где будут представлены коды всех цветов, используемых в шаблоне, а также возможность экспортировать их в различных форматах -  HTML+CSS, XML, Text, ACO (Photoshop palette), GPL (GIMP palette). Выбор весьма велик:)

Как по мне, Color scheme designer – очень добротный инструмент для дизайнерской работы. Всю ее зав вас он, конечно, не сделает, но помочь сможет. К тому же будет, думаю, полезен начинающим веб дизайнерам.

P.S. Интересуетесь покером? – тогда вам пригодятся пароли для фрироллов.
Посмотрите салоны красоты Украины – полный список.
Классный женский журнал для девушек и женщин.

© Вебдванольные заметки, 2009. | Комментариев - 7 | Категория Дизайнерам.

Интересные статьи по теме

• Сервис PR CY – инструменты и панель для оптимизатора (9)
• Сервис Freetwitterdesigner – создание фона для twitter (1)
• Сервис Confiture (конфитюр) – резервное копирование online (0)
• Flickr – самый продвинутый и популярный фотохостинг (4)
• Яндекс краски – нарисуй свою открытку (15)

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

Так вот чтобы облегчить задачу конструирования такого фона советую зайти на новый англоязычный сервис Freetwitterdesigner.

Данный инструмент позволит быстро и легко создать собственный фон для твиттера, без специальных дизайнерских навыков. Нужно будет только обновить свой Flash плеер до 10-ой версии, и вы получите такой себе мини графический редактор для twitter.

Итак, что же здесь есть. Слева сверху располагаются 3 элемента для добавления новых объектов – текста, формы и изображения.

Справа находятся элементы управления для созданных объектов. Как и в фотошопе, здесь есть слои, которые можно копировать, удалять, а также изменять их очередность. Далее идет блок выбора шрифта (для текстового элемента) и цвета (для всех). Также можно задавать степень прозрачности (Fade) и некоторые стили (Styles) – размытие, объемность, тень и т.п.

В нижнем левом углу есть еще ряд настроек для ленты сообщений твиттера. Они никак не влияют на самое фоновое изображение, но позволяют увидеть как будет смотреться общая композиция, что весьма кстати. С помощью опции Twitter Overlay можно сделать центральный блок с текстом прозрачным либо вообще убрать пока вы работаете над фоном. Также там есть ряд настроек цветовой гаммы – фон, ссылки, текст, фон сайдбара и т.п.

После завершения всех работ нажимаете кнопку Generate Image и background будет готов. Единственным недостатком является, пожалуй, копирайт проекта в самом верхнем левом углу, но такая уж плата за удобство использования. Хотя, если у вас на изображении в этом месте есть сплошной фон, можете зарисовать:) Также, к сожалению, в тексте не поддерживается русский шрифт, что может слегка смазать общие впечатление от сервиса.

Чтобы установить только что созданный авторский фон, заходим в твиттер, меню Settings – Design. Здесь в самом низу будет 2 ссылки – Change background image и Change design colors, которые позволяют соответственно сменить фоновое изображение и задать цветовую палитру для вашего аккаунта. В принципе, ничего сложного.

Желаю успехов в создании красивых фонов.

P.S. Советую также взглянуть на полезные сервисы для twitter.

На специальном проекте вы можете прослушать радио онлайн.

Или посмотреть необычные гаджеты.

И на последок – интересная статья про мобильный маркетинг (Bluetooth, sms – маркетинг).

© Вебдванольные заметки, 2009. | 1 комментарий | Категория Twitter, Дизайнерам.

Интересные статьи по теме

• Сервис Untweeps – убираем неактивных твиттерян (2)
• Яндекс краски – нарисуй свою открытку (15)
• TweetMeme – социальная сеть для twitter (12)
• Flickr – самый продвинутый и популярный фотохостинг (4)
• Color Scheme Designer – онлайн сервис создания цветовой палитры сайта (7)