Posts Tagged ‘веб дизайн’

Разработка дизайна для сайта Photoblog

January 12th, 2010

photoblog_smРазработка дизайна для сайта школы цифровой фотографии – Photoblog

Главной задачей сайта является подбор материала для людей, которые хотят научится делать качественные цифровые фотоснимки. Сделать сайт интересным как для новичков так и для профессионалов.

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

Как создать анимационный баннер в Photoshop CS3

November 23rd, 2009

До выхода версии Photosop CS3 анимационный баннер в GIF формате можно было сделать в программе Image Ready. Теперь компания Adobe объединила эти 2 программы.
Сегодня я расскажу вам как сделать простой анимационный баннер в формате GIF с помощью программы Photosop CS3.

» Read more: Как создать анимационный баннер в Photoshop CS3

5 советов веб-дизайнеру

September 11th, 2009

Как говорил Гарольд Тейлор, консультант по планированию времени, ” Лучший способ добиться успеха – следовать советам, которые мы даем другим.”

Поэтому хочу дать несколько простых, но важных советов молодым веб-дизайнерам, которые полны сил и желания учиться веб дизайну.

tablica_shirina_maketa1. Соблюдайте ширину макета в зависимости от разрешения экрана.

Если Ваш дизайн фиксированной ширины, то эта табличка поможет Вам определиться с шириной макета.

2. Давайте названия всем слоям и группируйте слои по папкам.

Это поможет вам и верстальщику быстро ориентироваться на макете, находить необходимые слои и папки.

3. Используйте для контента распространенные шрифты.

Такие как Arial, Tahoma, Verdana, Times New Roman, Georgia, Helvetika возможно еще некоторые шрифты которые сейчас я не вспомнила. Эти шрифты есть у любого пользователя сети интернет.


4. Не используйте сглаживание шрифтов (исключения могут составлять лишь некоторые заголовки).

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

5. Архивируйте psd файл перед отправкой

psd файлы хорошо сжимаются.

Текст ни о чем или что такое Рыба в веб дизайне.

August 30th, 2009

lorem_ipsumЧасто, приступая к разработке сайта, заказчик еще не подготовил материал, который будет на нем размещен. Поэтому дизайнеру приходится прибегать к размещению на макете текста ни о чем или как называют это в веб дизайне – Рыба.

Рыба – это временный текст, которым заполняют макет страницы сайта для создания общей картины дизайна. Он может не иметь смысла. Однако, надо помнить, что текст рыбы для англоязычного сайта и для русскоязычного сайта должен быть разным. Например, для англоязычных сайтов я всегда использую “Lorem ipsum” – это искаженный отрывок из философского трактата Цицирона “О пределах добра и зла” на латинском языке.

Он выглядит так “Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.”

Для русскоязычных сайтов я использую цитаты из энциклопедий. Например, информацию о планете Земля из известной электронной энциклопедии Wikipedia.

Конечно, лучше всего использовать текст, который будет реально размещен на сайте, но если заказчик не успевает Вам его предоставить – используйте рыбу.

Креативные дизайны сайтов

August 26th, 2009

Глобатор выложил на своем блоге подборку креативных дизайнов. Некоторые из этих сайтов меня порадовали своей оригинальностью.

Больше всего мне понравились сайты:

Soytuaire.labuat.com – этот сайт абсолютно не похож на все остальные что мне доводилось видеть. Вы можите здесь просто рисовать под музыку незамысловатые сюжеты просто двигая мышкой и у вас это будет получаться независимо от вашего таланта рисовать :) . Сайт именно что бы расслабиться.

site

Alexarts.ru – страница дизайнера из Москвы. Красивый фон плюс web 2.0 технологии сделали сайт удобным и креативным.

site2

v5design.com – сайт американской веб студии. К подобным сайтам я не равнодушна. Прекрасная картина природы на фоне в сочетании с музыкой пения птиц и сверчков навивают особую атмосферу. А что касается юзабилити, то, по моему мнению, информация вполне доступна, вот только шрифт мелковат.

site3

Спасибо за хорошее настроение и за вдохновение!

Подборка хороших книг по Юзабилити

August 22nd, 2009

“Юзабилити страниц” – такой пункт все чаще и чаще начинает появляться в техническом задании. Веб дизайнер хорошо должен понимать о чем идет речь и продумать взаимодействие между пользователем и системой. Сайт будет более успешным, если его дизайн направлен на удобство пользования. К примеру, я не люблю сайты на которых все двигается и играет неземная музыка. Всего должно быть в меру и главная идея сайта не должна теряться во всей этой шелухе.

Хочу посоветовать вам несколько книг по юзабилити, которые я прочитала и собираюсь прочитать.

book_usabilituКнига “Web-дизайн. Удобство использования Web-сайтов.” Якоб Нильсен и Хоа Лоранджер.

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

book_usabilitu2Книга “Веб-дизайн: книга Стива Круга или “не заставляйте меня думать!” Стив Круг.

Главная идея книги – “Не заставляйте меня думать!”. Стив Круг – один из весьма уважаемых консультантов по юзабилити-тестированию и дизайну интерфейсов. В книге описаны принципы правильного подхода к веб-юзабилити, ведь люди не будут пользоваться сайтом, если им не понятно как по нему перемещаться и как искать полезную информацию. Если прочитанное изменит ваши взгляды на веб-дизайн, то в этом не будет ничего удивительного.

book_usabilitu3Книга “Разработка пользовательских интерфейсов” Дженифер Тидвелл.

Эту книгу я только хочу прочесть. Как показывает практика, книги, которые предлагает издательство O’Reilly, всегда качественны. Так же я много слышала положительных отзывов о данной книге.

Определения шрифта на картинке

August 20th, 2009

По работе я часто сталкивалась с проблемой определения шрифта на картинке. Без исходника это сделать достаточно трудно. Однако я нашла способ решения этой проблемы и хочу поделиться этим решением с вами.

Это сайт, который может распознавать шрифт на jpg или gif изображениях. Собственно вот он http://www.myfonts.com

Расскажу как пользоваться этим сайтом на примере логотипа электронной энциклопедии Wikipedia.

wikipedia

Загрузив изображение, я прописала там некоторые буквы как на картинке ниже, т.к программа не всегда корректно может распознать буквы.

wikipedia1

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

wikipedia2

Кисти Photoshop – крылья ангела

August 17th, 2009

angelИногда, дизайнера накрывает волной вдохновения, и в такие моменты хочется творить что-то прекрасное, что-то такое, от чего приходишь в восторг. Однако, не всегда умения позволяют сделать то, что нарисовала твоя фантазия.

Создавая свои шедевры, вы можете облегчить свою задачу, воспользовавшись уже готовыми кистями Photoshop. К примеру, абсолютно разные крылья ангелов, Вы сможете найти на сайте http://browse.deviantart.com

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

Творите! И будьте смелыми в своих идеях!

На заметку дизайнеру

August 12th, 2009

web-designЧасто дизайнеры стремятся сделать лишь модный скриншот для своего портфолио и при этом забывают, что им надо разработать удобный и понятныый дизайн для пользователя. Хочу описать несколько истин, которые не стоит забывать дизайнеру при разработке дизайна.

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

2. Расположение на экране. Вам надо подумать над тем будет ли дизайн резиновым или статическим. Сейчас у пользователей стоят различные мониторы от 14 дюймовых до 30 дюймовых. Ваш дизайн должен смотреться одинаково хорошо при любом разрешении. Лично я сторонник статических дизайнов, которые не меняют свою ширину. Монитор у меня 22 дюйма и когда я захожу на резиновый сайт, то он ползет у меня по всему экрану и информация вмиг теряется.

3. Расположение элементов на странице. Всегда, когда рисуете дизайн, пользуйтесь линейкой и ее направляющими. Выравнивайте все относительно ее. Мелочи, но они так заметны и очень влияют на внешний вид дизайна.

4. Навигация. Учитывайте возможность расширения функций сайта и соответственно возможность расширения навигации.

5. Отношение к работе. Всегда работайте так, как будто-то это ваш проект. Используйте все свои дизайнерские возможности. Существует мнение “Заказчик всегда прав”, но старайтесь давать ему советы и обосновывать их, ведь дизайнер все-таки вы.

Разработка дизайна сайта мини-гостиниц на Черном море (Судак)

August 6th, 2009

Sysak_smРазработка дизайна сайта мини-гостиниц на Черном море в городе Судак.

В сотрудничестве с агенством “QMEDIA” был разработан дизайн сайта мини-гостинец Судака. Пожелания были, чтобы сайт был «чистенький», легкий и приятный для восприятия. По цветовой палитре предпочтение было отдано морским тонам.