Alt+N
Новость...

Просветите нас
Правила хорошей заметки для Дизайн-собаки

РСС

Короткометражный фильм «Портфолио»

Николай Паламарчук пишет: «Нашёл замечательное видео. Судя по всему, главный герой попадает во все неприятности, как раз не соблюдая правила вашей рубрики Советы“».

нет комментариев твитнуть  видео, портфолио, смешное

Сайт музея ван Гога

Сайт:
http://www.vangoghmuseum.nl/

Не так просто найти ссылку на коллекцию произведений, поэтому вот:
http://www.vangoghmuseum.nl/…/search/collection

Произведения даны в большом разрешении, можно скачать файлы себе, чтобы рассмотреть или повесить на рабочий стол. А ещё страницы многих картин содержат их подробные описания, например:
http://www.vangoghmuseum.nl/…/collection/s0094V1962

нет комментариев твитнуть  Винсент ван Гог, живопись, искусство, картина, музей, сайт

Историческое видео об интерфейсных элементах

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

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

0:02:30 — Полосы прокрутки
0:12:59 — Клёвая фишка, когда скролбар толкает курсор
0:13:55 — Таскание лифта скроллбара с нажатым Альтом, оказывается, работает на Маке до сих пор
0:17:00 — Целая специальная рамочка возникает, которая показывает, куда тебя переместит скроллинг! Видимо, попытка обратной связи в ситуации, когда всё окно перерисовать не получается

0:17:16 — Меню
0:19:00 — Экран похож на осциллограф :-) А уже попап-меню показывает
0:20:20 — Курсор прыгает по меню сам, чтобы не надо было двигать. Интересно, почему все интерфейсы, двигающие курсор мыши за человека, не выжили
0:21:07 — Hamburger menu!
0:26:00 — Круглые меню
0:28:50 — Отрывные меню, превращающиеся в палитры
0:33:20 — Пункты меню по умолчанию и их предпросмотр
0:35:10 — Превращение меню в окно
0:39:35 — Клик в список опций с контролем и шифтом до сих работает именно так (на Маке вместо контроля комманд)

0:45:02 — Палитры

0:46:48 — Кнопки

0:54:22 — Радиокнопки
0:55:47 — Привычный вид
0:56:33 — Лаконичный способ отличить радиокнопки от чекбоксов через касание. Может быть актуально в эпоху флэт-дизайна

0:59:16 — Чекбоксы

1:01:14 — Выделение текста
1:05:47 — Оказывается, раньше выделенный текст не стирался, когда печатаешь

1:13:26 — Ввод
1:21:31 — Формы и диалоговые окна
1:30:05 — Выделение графических объектов
1:34:27 — Редактирование графических объектов
1:39:15 — Иконки и окна
1:47:24 — Управление окнами

1 комментарий твитнуть  видео, интерфейс, история, меню, прокрутка, радиокнопка, чекбокс

12 анимационных приёмов

http://the12principles.tumblr.com/
Квадратики как живые, а всё благодаря использованию разных смешных мультяшных приёмов. Надо пойти на сайт и посмотреть, а вот статичный кадр для привлечения внимания:

1 комментарий твитнуть  анимация, мультфильм, приём

Визуализация методов сортировки

http://sorting.at/
Отличная визуализация многочисленных алгоритмов сортировки. Можно добавить несколько разных алгоритмов, и сравнивать в реальном времени их эффективность для разных массивов исходных данных: случайных, изначально упорядоченных, перевёрнутых. Жалко, что в школе нам не так их показывали, и я не мог понять, зачем нужно что-то кроме тупого и понятного «пузырька».

Когда в Вилларибо всё давно готово, в Виллабаджо всё ещё сортируют:

1 комментарий твитнуть  алгоритм, визуализация, программирование, сортировка

Сайт шрифта «Фландрия»

Сайт шрифта. «Нелинейный» скроллинг используется для крутой идеи: «примерить» шрифт к разным носителям. Выглядит круто и логично:

http://www.flandriatype.com

Скриншоты круты, но на самом деле надо идти на сам сайт смотреть.

2 комментария твитнуть  flandria, прокрутка, сайт, скроллинг, шрифт

Одна фотография, которая выглядит как четыре

Это одна фотография:

Доказательство:

Источник:
http://kottke.org/…-like-4-individual-photographs

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

2 комментария твитнуть  информационный дизайн, фотография

Интерфейс экрана автомобиля «Тесла модель С»

Очень опрятен для автомобильного дисплея:

Источник:
http://fontsinuse.com/…-model-s-dashboard-display

6 комментариев твитнуть  автомобиль, интерфейс, тачскрин

Вот сегодня

Интерактивный сайт показывает, где сегодняшний день расположен на шкале времени:

http://hereistoday.com/

1 комментарий твитнуть  информационный дизайн

Интерфейс из фильма «Обливион»

Кино:

Источник:
http://work.gmunk.com/OBLIVION-GFX

2 комментария твитнуть  вау-эффект, интерфейс, кино

Сканы жалобной книги

На сайте гостиницы «РМБМ» в резделе отзывов — настоящие сканы из жалобной книги и распечатки писем:

Сейчас там их целых 65 штук:
http://rmbmhotel.ru/otzivy

Классный способ сделать, чтобы тебе поверили.

нет комментариев твитнуть  отель, приём

Построение кривых Безье

Наглядное объяснение того, как строятся кривые Безье. Процесс построения показан во времени с анимацией:
http://www.jasondavies.com/…-bezier

Если точек две (P0 и P1), то кривая, соединяющая их — это просто множество точек, находящихся на расстоянии t (от 0 до 1) по пути от P0 до P1. Если точек три, то для каждого t до 0 до 1 мы находим точки на расстоянии t от P0 до P1 и от P1 до P2, соединяем их ещё одним отрезком и ставим точку на расстоянии t уже вдоль неё. С увеличением числа точек, число таких построений возрастает.

нет комментариев твитнуть  вектор, информационный дизайн, объяснение

История скроллбара

За 20 лет скроллбар сильно похорошел:

Источник:
http://thisisnthappiness.com/…/the-history-of-the-scroll-bar

5 комментариев твитнуть  интерфейс, скролл

Усейн Болт и другие бегуны

Нью-Йорк-Таймс опубликовал инфографику, сравнивающую очередной рекордный олимпийский 100-метровый забег Усейна Болта, с забегами других чемпионов разных лет.

Видео по ссылке:
http://www.nytimes.com/…-every-medalist-ever.html?hp

Там снизу ещё ссылки на подобные ролики про плавание и прыжки в длину.

Некоторые кадры:

1 комментарий твитнуть  видео, информационный дизайн, спорт

Инфографика советской эпохи

Источник:
http://ripetungi.com/…-era-infographics

5 комментариев твитнуть  информационный дизайн, история, СССР

Новый стиль Микрософта (студпроект)

Эндрю Ким предлагает Микрософту радикально сменить стиль:

Ещё картинки
http://www.minimallyminimal.com/…/7/3/the-next-microsoft.html

14 комментариев твитнуть  графдизайн, Микрософт

Лип-моушен

В следующем году выйдет новая система распознавания жестов, которая в сто раз точнее и быстрее Кинекта (недавно Рамиль Шайхутдинов писал здесь о ней).

Техдиректор показывает, что можно делать с этой штукой:

Употребляет термин «legacy touch».

Подробности — на Вёрдже:
http://www.theverge.com/…/leap-motion-gesture-controls

2 комментария твитнуть  интерфейс

Дмитрий:

на дисплее Mac Book Pro даже блик правильный :-)

Алексей:

@Дмитрий, только почему-то Windows установлен ))

Сколько воды на Земле

Сколько воды на Земле:

Сколько пресной воды в сравнении с общим количеством воды и самой землёй:

Источник:
http://gizmodo.com/…-water-there-is-on-earth

4 комментария твитнуть  информационный дизайн

Обложки ЦС6

Обложки продуктов Адоби ЦС6, сделанные в «Толессоне»:

Кино:

Ссылка:
http://tolleson.com/story/adobe-CS6/

11 комментариев твитнуть  графдизайн

Вариант дизайна шведских крон

В Швеции планируют заменить банкноты и монеты новыми. Стокгольмская студия «СДЛ» предложила свой вариант их дизайна. Вариант вышел в финал, но, к сожалению, не выиграл.

ПДФ:
http://www.stockholmdesignlab.se/…/2012/04/Riksbanken.pdf

Страничка:
http://www.stockholmdesignlab.se/…-for-new-money

8 комментариев твитнуть  графдизайн, деньги



© 2017

Дизайн-бюро
Артёма Горбунова

Пишите: mail@artgorbunov.ru