Встреча Третья. «Web-дизайн против проектирования интерфейсов»

1. Встреча Третья. «Web-дизайн vs. Проектирование интерфейсов»

Уральский федеральный университет
имени первого Президента России Б.Н.Ельцина
Междисциплинарный семинар в области Интернет-технологий
Встреча Третья.
«Web-дизайн vs. Проектирование интерфейсов»
Гаранин Дмитрий
КН-401
13 ноября 2017
Екатеринбург

2.

vs.
Дизайн

3.

“Я так вижу”
Объективность

4.

Самовыражение
“Я так вижу”
Объективность

5.

Самовыражение
Неосознанное
Осознанное
“Я так вижу”
Объективность

6.

Деятельность
Неосознанное
Осознанное
“Я так вижу”
Объективность

7.

8.

9.

10.

ок, а что с web’ом?

11.

https://www.usatoday.com/

12.

http://www.dpgraph.com/

13.

http://www.50kopeek.kiev.ua/

14.

15.

ок, а как это устроено ?

16.

№1. Компании

17.

18.

-
-
Этан Маркотт (среди его клиентов W3C, написал “Отзывчивый
web-дизайн”, придумал понятие “отзывчивый дизайн”, работал
над редакцией “Web-дизайн по стандартам”);
Крис Койер (CSS-tricks.com - его сайт, курсы на кикстартер)
Артемий лебедев (ководство ну и так по мелочам: иконка
“Домой”, растяжение сайта по ширине окна и т.д.)
Остальные: http://mcocos.ru/infodesign/articles/znamenitye-dizainery/

19.

http://rainforest.arkivert.no

20.

https://fabianirsara.com/

21.

http://www.web-expert.it/

22.

https://prashantsani.com/

23.

https://shantellmartin.art/

24.

http://fabiotoste.com/

25.

№2. Процесс разработки

26.

Мемас-схема
Схема реализации
реализации
идеи
идеи
Нет*
*если у вас нет кучи денег, раскрученного имени, магических навыков или если вы не продали душу кое-кому

27.

Самая настоящая мемас-схема реализации идеи
Делать макет
Идея
Тестирование
Разработка
ИТЕРАЦИЯ
Успех

28.

№3. Условные рефлексы

29.

3.1. Макет

30.

<header>
<aside>

31.

<header>
<aside>
<footer>

32.

<nav>

33.

3.2. Элементы

34.

35.

36.

вот только...

37.

38.

39.

40.

41.

42.

3.3. Цветовая гамма и ужасы этого мира

43.

http://www.miauk.com/

44.

http://www.miauk.com/

45.

http://www.theworldsworstwebsiteever.com/

46.

http://www.berezowka.narod.ru/

47.

http://www.greatdreams.com/

48.

Лучше увидеть в живую
-
http://gamosyaca.ru/
http://endosur.narod.ru/ (ШИКАРНЫЙ)
http://www.eniology.ktk.ru/
http://www.50kopeek.kiev.ua/ (ОН ХОРОШ, ОСОБОЕ ВНИМАНИЕ)
http://www.dokimos.org/
http://www.merryday.ru/ (о навигации)
http://www.constellation7.org/Constellation-Seven/Josiah/Index.htm

49.

Десерт
-
http://heaven.internetarchaeology.org/heaven.html#bottom

50.

Победители на звание “Самый лучший дизайн рунета 2015 ”
-
http://2015.goldensite.ru/results/

51.

чтобы не убивать в вас чувство прекрасного

52.

http://metro.ru/

53.

И что же делать?

54.

Вопросы?