Главная » Статьи » Разработка сайтов » Web-дизайн

Суперминиатюрный городской стиль

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

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

Интернет имеет ограниченную пропускную способность,а экраны пользователей - различные размеры. Несомненно, коллаж с высоким качеством в формате JPEG размером 250К превосходно выглядит на вашем 21-дюймовом мониторе с миллионом цветов при загрузке через корпоративную выделенную линию. Но как насчёт бедного старичка из Палукавилля, пытающегося зайти на ваш сайт посредством модема со скоростью ЗЗК и имеющего 14-дюймовый монитор с 256 цветами? Здесь придет на помощь суперминиатюрный городской стиль (SuperTiny SimCity Style)!

Целое поколение компьютерных Пикассо поставило свой талант на службу веб-дизайна,получив игривые, впечатляющие и быстро загружающиеся результаты. Многолетний опыт размещения огромных объёмов информации на маленьких площадях подготовил дизайнеров суперминиатюрного городского стиля к борьбе с ограниченными пространством окна браузера и пропускной способностью. Кто мог предположить, что дизайнеры малострочных видеоигр 80-х станут любимцами авангарда современного веб-дизайна?


Суперминиатюрный городской дизайн характеризуется, прежде всего, наличием крохотных цифровых человечков, зданий и предметов. Он также известен благодаря использованию очень маленьких экранных шрифтов и сильного дробления. Как и в случае с другими стилями дизайна, суперминиатюрный городской стиль можно применять или на все 100% или частично. В любом случае он будет обаятелен и привлекателен.

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


Kaliber 10000: Бог проявляется в мелочах

k10k.net не был первым сайтом, использующим этот стиль, но считается, что именно он способствовал росту популярности суперминиатюрного городского дизайна. К10К - это регулярно обновляемый,заполненный информацией сайт,который посещается большим числом пользователей и предлагает им работу с различными базами данных. При этом создателям сайта удается поддерживать дружелюбную, доступную атмосферу благодаря интерфейсу, выдержанному в суперминиатюрном городском стиле.


Почти все ссылки на главной страницеК10К представляют собой анимацию. Особенно удачны квадратики пиктограмм в верхнем меню, которое указывает основные разделы сайта. При наведение курсора мыши на квадратик он превращается в кружок, начинает вращаться пиктограмма и появляется описание этого раздела. Обратите внимание,что размер пиктограмм соотносится с размером указателя мыши, поэтому наведение на них курсора «ощущается» как реальное прикосновение к чему-то.

Сначала загружается крошечная анимация логотипа в левом верхнем углу, который случайным образом изменяется при каждом посещении сайта. Так что пока вы ждете загрузки остальной части страницы (что занимает только несколько секунд на модеме со скоростью 56К), вам есть что посмотреть. В правом нижнем углу Kaliber Кam загружается случайным образом выбранная анимация от дизайнеров сайта, изображающая картинки из их повседневной жизни (в спортзале, во сне,во время чистки зубов, на вечеринках). К счастью, вы избавлены от перегружающего сеть потока информации, поступающей от вэб-камеры. Вместо этого все события представлены в виде анимированных растровых картинок в формате GIF. Все картинки тщательно продуманы: в каждый момент времени происходит минимальное число движений, так что они не отвлекают от остального содержания страницы.

«Изумительно сделано» - эти слова лучше всего описывают К10К. Чем пристальнее вы вглядываетесь, тем больше замечаете, с каким вниманием относятся разработчики сайта к подробностям. Возникает ощущение, что он был создан вручную, каждый пиксел по отдельности. И это недалеко от истины.

Для разработки сайта потребовалось мастерство Пер (Per) в области программной поддержки, планирование, кодирование и графика Тока Найгарда(Токе Nygarde) и Майкла Шмидта (MichaelSchmidt). К10К является результатом труда целеустремленных, маниакально настойчивых перфекционистов, которые решили подарить пользователю совершенное ощущение. Обратите внимание, сколько информации содержится на странице, ширина которой составляет всего 800 пикселов. Я насчитал 4 столбца с 14 отдельными содержательными разделами. И в то же время дизайн кажется просторным.Этот эффект достигается с помощью удачных приёмов дробления и использования суперминиатюрных растровых шрифтов.




flipflopflyin: все дело в идее


flipflopflyin.com - это прелестная персональная домашняя страница некоего Крейга Робинсона (Craig Robinson). Крег является создателем «мини-попов», галереи тщательно вырисованных растровых карикатур различных знаменитостей. Он преуспел в области использования минимального числа пикселов для передачи максимального объёма информации. Особенно искусно сделана серия «Fun Fun Fun», где представлены десять анимированных картинок, изображающих различные способы весёлого времяпрепровождения. Несмотря на то, что каждая картинка занимает весь экран, лишь одна её часть анимирована.


Серия «Fun Fun Fun» затягивает: каждая сцена настолько оригинальна (и так быстро загружается), что вы готовы просмотреть всё просто для того, чтобы увидеть, что же будет дальше. В свое время я просмотрел немало Flash-анимаций размером 300К, однако немногие работы оказывались такими захватывающими, как эти анимированные GIF-изображения минимального размера.




Категория: Web-дизайн | (04.06.2013) |
Просмотров: 633 | Теги: дизайнер, вэб дизайн, разработка сайта, сайт | Рейтинг: 0.0/0
Всего комментариев: 0

Услуги веб-студии

  1. Современные сайты Европейского уровня под ключ
  2. Благодаря таким технологиям как HTML5, CSS3, jQuery и Parallax Ваш сайт буквально будет живым
  3. Благодаря адаптивному дизайну ваш сайт будет удобен для просмотра на экранах любых размеров
  4. Мы делаем сайты оптимизированные под Google и Яндекс

Заказать сайт
  • Услуги хостинга. Помощь в регистрации домена
  • Маркетинговый анализ перед созданием — выявление необходимого функционала для сайта
  • Разработка дизайна или настройка шаблона
  • Кроссбраузерная и адаптированая верстка для всех устройств (ПК, планшеты, смартфоны)
  • Наполнение сайта
  • Предоставление электронной почты вида имя@ваш-сайт.ru
  • Регисрация сайта в поисковых системах Яндекс, Google, Mail, Rambler
  • Подключение Яндекс веб-аналитики (вы будете знать всё о посетителях вашего сайта)
  • Поддержка и администрирование сайта
  • Раскрутка и продвижение сайта
  • Обучение работе с сайтом. Быстро. Качественно. Онлайн
  • Вам передаются исключительные (полные) права на разработанный сайт
Читать далее
Разработка корпаративных сайтов & Landing Page от 8 000 руб.
Сайт визитка от 5 000 руб. Читать далее
Практика показывает, что Интернет является огромной площадкой для развития бизнеса, а сайты — очень сильным маркетинговым инструментом. Чтобы извлечь максимальную выгоду из сайта, им нужно заниматься, его нужно развивать. Потенциальным клиентам будет проще найти вас, если сайт будет на первых строчках в результатах поиска. Читать далее
Любая могучая идея абсолютно восхитительна и в высшей степени бесполезна, пока ты не решишься заставить её работать. Читать далее

4 правила успешного бизнеса

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

Подробнее

5 секретов эффективной рекламы

Сотни листовок, буклетов, визиток, брошюр и других рекламных материалов обычно сразу отправляются в мусорные корзины.

Подробнее

Рекламодатель уходит в интернет

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

Подробнее

Mobile-friendly или ну полная оптимизация

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

Подробнее

Адаптивные сайты

Как адаптивный дизайн поможет увеличить посещаемость сайта?

Подробнее