Блог

Минималистический дизайн сайта

November 6th, 2009

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

Самое главное в создании дизайна сайта – это правильно применять законы композиции и цветовых решений.

Прежде всего – это отсутствие графических элементов, которые не несут в себе функциональной нагрузки. К таким элементам можно отнести текстурные фоны. В минималистическом стиле они всегда однотонные и как правило – белые. Окантовка никогда не идет объемной или толстой. Это обычно однопиксельная полоска. По-поводу флеш-анимации и картинок на подобном дизайне. Картинки могут присутствовать на сайте, но в виде обычной фотографии по теме сайта или каталога товаров, а вот флеш-анимация, на дизайне в стиле минимализма – отсутствует. Цветовая палитра должна состоять не более чем из 3 основных цветов, хотя, в идеале, это должно распространяться и на дизайны сайтов других стилей. Шрифты, как правило, используются простые, без засечек.

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

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

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

Топ 10 фотографий. Сентябрь.

October 1st, 2009

Вторая подборка фотографий сделанная фотоаппаратом Sony Alpha a200. Сентябрь месяц.

Кошка

photo1_sm

» Read more: Топ 10 фотографий. Сентябрь.

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

September 11th, 2009

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

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

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

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

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

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

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

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


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

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

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

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

Топ 10 фотографий. Август

August 31st, 2009

Первая подборка фотографий сделанная фотоаппаратом Sony Alpha a200. Август месяц.

Закаты

photo1_sm

» Read more: Топ 10 фотографий. Август

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

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 19th, 2009

Видеоурок на русском языке. В нем описан простой способ редактирования фигуры с помощью Фильтра – Пластика.

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

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

August 17th, 2009

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

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

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

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