Огонь. Молоты. Таланты

дмитрий карпов 2012

15-16 сентября. Екатеринбургтренировка креативности в веб-дизайне и новых цифровых медиа, «курс-бестселлер» для практикующих профессионалов, дизайнеров и UX специалистов из комбинации оригинальных методик и известных практик digital

Часть номер ноль: «Ты что с Урала?»Часть первая: «Digital технология перемен»Часть вторая: Workshop «Огонь и молоты»

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

Маршалл Маклюэн

Знакомимся. Люди и интерактивная среда, сайты, приложения, сервисы, устройства

Часть номер ноль: «Ты что с Урала?»Воля, пушки, соль и камень

Часть номер ноль: «Ты что с Урала?»Ермак и творческое мышление

Нам не хватает желания желать

Цифровая технология перемен

Любой технологии присущ мидасов эффект: как только в обществе возникает усиление какого-либо явления, всё остальное мироустройство тут же начинает меняться, чтобы встроить в себя эту новинку. Как только в обществе появляется новая технология, она тут же меняет всю структуру этого общества. Следовательно, новая технология — революционный по своей натуре ингредиент. Мы можем убедиться в этом, наблюдая, как развиваются электрические медиа.

Маршалл Маклюэн

Часть номер один: «Как я это делал?»Два часа на афишу...

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

В чем ценность дизайна?Ценность.

Ценность удобства?Ценность экономии?Ценность качества жизни?

прием: креативное технологическоепроектирование

дизайнер в digital обязан знать и понимать технологии, изобретательно использовать возможности цифровой средыи постоянно самообучаться

прием: креативное тех-проектирование

место / карты / координаты

переводчик

динамический постинг (Twitter)

видео-хостинг

http://www.youtube.com/user/chromefastball

Атрибуты коммуникации бренда

скоростьизобретательность

API соц. сети

стабильность

https://developers.google.com/translate/v2/pricing?hl=ru

не знаешь что, придумай как

технологии сами дают основу для новых идей... например CSS3

• Media Queries• RGBa & HSLa• Gradients• @font-face / Google fonts• Rounded Corners• Box Shadow• Multiple Backgrounds• Visual Effects

Color• RGBa (255, 255, 255, 0.5);• HSLa (360, 100%, 50%, 0.5);

border-radiusborder-radius: 10px;

box-shadowbox-shadow (horizontal offset,vertical offset,optional blur distance,optional distance,optional color,optional inset)

• min-width• max-width• device-width• min-device-width• max-device-width• orientation• -webkit-min-device-pixel-ratio

opacity: 0.5;-webkit-transition-property: opacity;-webkit-transition-duration: 1s;-webkit-transition-timing-function: ease;opacity: 1;

Color• RGBa (255, 255, 255, 0.5);• HSLa (360, 100%, 50%, 0.5);

#alfa_type_color {color:hsla(44, 100%, 33%, .70);}

CSS3дмитрий карпов 2012

Color• RGBa (255, 255, 255, 0.5);• HSLa (360, 100%, 50%, 0.5);

• min-width• max-width• device-width• min-device-width• max-device-width• orientation• -webkit-min-device-pixel-ratio

Размер экрана меньше 980px (адаптивный макет)

Для размера экрана меньше 980px применим следующие правила:pagewrap = ширина 95%;content = ширина 60%;sidebar = ширина 30%.

Вариант с использованием media queries. Для определенных разрешений мы допускаем или запрещаем показ изображений (img), через CSS (display: none;). Современные браузеры адаптированы так, что по умолчанию не загружают изображения, которые отключены для показа.

Этот CSS будет применяться для размеря экрана меньше 480px, которая соответствует ширине iPhone в альбомной ориентации.html = отключаем регулировку размера шрифта. По умолчанию iPhone увеличивает размер шрифта, для более комфортного чтения. Вы можете это отключить добавив -webkit-text-size-adjust: none;main-nav = сбрасываем размер шрифта до 90%.

@media screen and (max-width: 480px) { html { -webkit-text-size-adjust: none; } #main-nav a { font-size: 90%; padding: 10px 8px; }}

http://narrowdesign.com/

@font-face { font-family: 'Righteous'; font-style: normal; font-weight: 400; src: local('Righteous'), local('Righteous-Regular'), url(http://themes.googleusercontent.com/static/fonts/righteous/v2/w5P-SI7QJQSDqB3GziL8XbO3LdcAZYWl9Si6vvxL-qU.woff) format('woff');}@font-face { font-family: 'Sorts Mill Goudy'; font-style: normal; font-weight: 400; src: local('Sorts Mill Goudy Regular'), local('SortsMillGoudy-Regular'), url(http://themes.googleusercontent.com/static/fonts/sortsmillgoudy/v3/JzRrPKdwEnE8F1TDmDLMUtsZ51dqzBwIdH2JuTl9mv4.woff) format('woff');}

http://rule-of-three.co.uk/

http://www.myfonts.com/fonts/abstrkt/lineatura/light/

шрифты изданияNY Irvin NY Vogue Goat

~бренды участвуют в производстве фильма с новой интерактивной концепцией —вовлечением пользователей социальной сети, сценарий фильма подразумевает участие совершенно разнообразных личностей, часть которых будет из записанных видео участниками интерактивного проекта

API использования видеокамеры на компьютере пользователя в большинстве случаев используют Adobe Flash (но тенденция в замещении средствами JS и альтернативами)

http://www.xarg.org/project/jquery-webcam-plugin/

Практика

фото участников практики / упражнения собственность участников :) и не публикуетсяметодика: Дмитрий Карпов

Упражнение первое

Упражнение второе

Упражнение третье

Упражнение четвертое

Как выковывать новые идеи для цифровой интерактивной среды

Что нужно для успешного проекта в цифровой интерактивной среде, именуемо простым уральским словом DIGITAL?Ценность. Ценность идеи, материала, изменяемого мира вокруг.

direction

interaction

graphics art

languagetechnology

ideation

direction

interaction

graphics art

languagetechnology

ideation

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

direction

interaction

graphics art

languagetechnology

ideation

intuitive interfaceexperience artistic innovation

Культурные особенности

{Нет такой общности людей как «целевая аудитория», есть люди одних взглядов, общего опыта, языка, близких целей и предсказуемых возможностей. Давайте поговорим о людях соседней улицы или района. Давайте поговорим об «Уралмаше»}

Новые форматы медиа

Формат композиции в веб-дизайне

дмитрий карпов / desmonych@gmail.com 2012г

cтереотипы композиции позволяют создавать привычные, хорошо знакомые информационные системы, интерфейсы, поведенческие паттерны,что помогает строить эффективное интерактивное взаимодействие

основной принцип и критерий классификации композиционных принципов в особенностях навигационного блока и решении интерактивного пространства

Текстовый - форматПервые сайты в сети. Дизайн средствами HTML c минимумом графики и браузерной интерпретацией по умолчанию (серый фон, синие ссылки) 1993-1996 распространенный с выравниванием по центру элементов или по левому краю экрана

Конус - форматстандартные композиционные модели формат 1993-1996 распространенный с выравниванием по центру элементов

LEFT - форматстандартные композиционные модели формат 1996-1999

хорошо знакомый и простойформат многих информационных ресурсоввертикальный блок навигации слева

LEFT - форматстандартные композиционные модели формат 1996-1999

LEFT - форматстандартные композиционные модели

формат 1996-1999 традиции вертикальной навигации с левой

стороны страницы заметно используются сегодня в веб

Г- форматстандартные композиционные моделисамый распространенный 1995-2005

П- форматстандартные композиционные модели широко используется 1996-2005

самый популярныйудобный, знакомыйтри блока материалов по краям экрана

П- форматстандартные композиционные модели широко используется 1996-2005

Диск- форматстандартная композиционная модель для промо-сайтов, корпоративных сайтов и мультимедиа дисковшироко используется 1996-1999 старая школа

TOP - форматстандартные композиционные модели

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

TOP - форматконцентрация важнейшего функционального материала и имиджевого / образного в верхней горизонтали страницы, активный headerиспользование доминирует1996-2002

cтереотипы композиции организация интерактивного пространствапрактические приемы проектного мышления в новых медиа

TOP LINE - форматстандартные композиционные модели

http://www.diesel.com/colorexposure/

MID-LINE - форматстандартные композиционные модели

Центральная горизонталь

навигация содержанием сайта

через центральный блок, который создает композиционный баланс

Центральная горизонтальнавигация содержанием сайтачерез центральный блок, который создает композиционный баланс

http://www.hidden-heroes.net/

http://krystalrae.com

TOP-SQUARE - форматстандартные композиционные модели

4-COLUMN - форматстандартные композиционные модели

http://www.legendary.com/

ступени - форматстандартные композиционные модели

http://www.bureau-va.com

angled - форматстандартные композиционные модели

http://htcsense.dk/

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

DOUBLE SLIDER - форматстандартные композиционные модели

http://www.budnitzbicycles.com/

DOUBLE SLIDER - форматстандартные композиционные модели

DOWN SLIDER - форматстандартные композиционные модели

http://graphicnovel-hybrid4.peugeot.com/start.html

вертикальноепадение метафора композиции в погружении зрителясодержание скользит вниз и возникает плавно с внешних краев браузера

http://www.newzealand.com/int/http://www.smashingmagazine.com/2012/03/08/behind-scenes-tourism-new-zealand/

WATERFALL - форматтенденция 2011-12

http://pinterest.com

MASH-UP - гибридный форматтенденция 2011-12

http://www.pinstagram.co/

MASH-UP - гибридный форматтенденция 2011-12 особенность в структурной эклектичности, комбинации совершенно разных, но хорошо знакомых принципов и паттернов

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

http://www.lust.nl/

http://www.sound.philips.com

BOTTOM LINE — формат навигации в нижней горизонтали страницыпривычная модель композиции с управлением контентом из нижней части страницы, фактически панель инструментов(данная область привычно используется для технической информации и сигнала пользователю, что страница загрузилась)

http://www.sound.philips.com/

http://lifeis.bbcearth.com/

FULL SCREEN MOTION — видео-сайтвидео композиционно построенное по приемам жанра, принципам съемки и динамике монтажа с возможностью управления сценами, обычно полноэкранное изображение

http://evelyn-interactive.searchingforabby.com/

FULL SCREEN MOTION — видео-сайтвидео композиционно построенное по приемам жанра, принципам съемки и динамике монтажа с возможностью управления сценами, обычно полноэкранное изображение

http://sagmeister.com/

VIMETUBE — видео-интерактивинтерактивные возможности средствами формата сервиса

http://www.youtube.com/profile?annotation_id=annotation_820885&feature=iv&src_vid=4ba1BqJ4S2M&user=tippexperience

http://www.ro.me/

INTERACTIVE MOTION — гибридный форматтенденция 2011-12 интерактивное 3D видео с условно свободной точкой фокуса, управление выбором точки просмотра и влиянием на композиционное положение объектов

Ошибки арт-директора

давайте обсудим отличные и заметные проекты

http://zestleadership.com/

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

арт-директор должен понимать, что такие огромные PNG в

современных браузерах не всегда плавно плывут, а клиенты плывут

за конкретными выгодами, экспертизой и авторитетом

http://zestleadership.com/

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

доводами, примерами, клиентами... много воды и черным

по черному

текст графикой делать не круто, особенно в такой композиции легко реализуемой средствами CSS

арт-директору надо следить как его макет реализуется в деталях, сохраняя эстетику и не теряя заложенной функциональности

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

слишком много одинаковых визуальных акцентов, цвета, размеры объектов, много скруглений, теней под объектами и текстом

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

самое скучное, это проектирование форм регистрации, покупки,

авторизации, прелодеров, сообщений об ошибках и

страниц 404... этим и займемся

Дизайн стандартных положений

Дизайн «стандартных положений»

http://www.ro.me/

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

Масштабируемость решения

http://bostonglobe.com

Адаптивный дизайн

Масштабируемость

Чему учат фантастические интерфейсы

метод разработки интерфейса

дмитрий карпов 2012г. desmonych@gmail.com

представим себе...

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

теперь фантастический концепт поместите в условия возможной реализации, экономики и технологий

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

теперь фантастический концепт поместите в условия возможной реализации, экономики и технологий

http://youtu.be/JSnB06um5r4

например, какие возможности могут появиться у интерактивных очков Google, какова возможная выгода от интеграции сервисов и новых возможностей?

как возможно взаимодействовать с очками, и по новому использовать поисковые возможности, карты, youtube, социальные сети, переводчик, хранение файлов?

фантастические сложные штуки, эстетика многодельности и затейливой информативности

фантастика и реальность

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

интерфейс обеспечивает управление поступающей информацией

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

скетчинг

представим себе совершенно новых существ и их возможности, представим себе интерфейс который управляется жестами или движением глаз, или мыслями

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

а может и не нужно смотреть фантастику, а сесть и внимательно анализировать существующие приемы на массовом рынке

дизайн—красиво

из физической реальности в цифровую

Гиперцифровая реальность

С вами разговаривает...

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

С вами разговаривает...

Талантливый интерфейс

Закон ФиттсаИнтеллектуальные методы / S.M.A.R.T / Wireframes/Features & Functionality matrix/ R.E.A.S.O.N / ПерсоныUX проектирование / landing page / Функциональное модульное зонированиеПостроение дизайн-процесса в интерактивных медиа

Закон Фиттса

http://fww.few.vu.nl/hci/interactive/fitts/

целенаправленность как метод

Specific / Специфичный

Measurable / Измеримый

Actionable / Осуществимый Relevant / Уместный

Trackable / Отслеживаемый

http://uxdesign.smashingmagazine.com/2011/09/13/the-s-m-a-r-t-user-experience-strategy/

целенаправленность как метод

Specific / Специфичный

Measurable / Измеримый

Actionable / Осуществимый Relevant / Уместный

Trackable / Отслеживаемый

http://uxdesign.smashingmagazine.com/2011/09/13/the-s-m-a-r-t-user-experience-strategy/

результатKPI

стратегия продукта

проектирование интерфейсаопыт коллег в разработке метода

проектирование интерактивной платформы / usability and desirability

фактически проектирование Landing Pages

проектирование интерфейса

проектирование интерактивной платформы / usability and desirability

определение групп задачпостроение иерархии важности и зависимости

А главныеB базовыеC вспомогательныеD дополнительные

сценарий взаимодействияпостроение модели взаимодействия на основе ментальной модели и поведенческой

A что увидит пользователь?B что подумает?C что сделает?D что получит? какой опыт приобретет?

оптимизация взаимодействияпо закону Фиттса скорость принятия решений и точность действий зависит ои дистанции до объекта и его величины

правило первого экранаправило акцентаправило цветового кодирования / глубины информации

Матрица функциональности (Features & Functionality)

ПЕРСОНЫ

метод разработки интерфейса на основе анализа пользователей /потребителей

работа с «персонами» или «архетипами»

http://www.f-i.com/htc/global/

детализированная виртуальная личность используемая для моделирования опыта,

мышления, интерактивного поведения для создания сценариев и характеристик

использования UI

собирательный образ коллективной личности для моделирования опыта, основных побудительных мотивов, целей и интерактивного поведения для создания универсальных, обобщенных интерактивных сценариев и характеристик UI

WIREFRAMES ПРОЕКТИРОВАНИЕ

http://www.f-i.com/htc/global/

МОЛОТЫ ПРОЕКТИРОВАНИЯ

http://www.axure.com

https://gomockingbird.com

ПРОЕКТИРОВАНИЕ ЭТАПА РАЗРАБОТКИ

Anton Repponen is Global Creative Director at Fi

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

ПРОЕКТИРОВАНИЕ ЭТАПА РАЗРАБОТКИ

Anton Repponen is Global Creative Director at Fi

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

Research Empathy Acceptance Sophistication Opportunity Nature

Reasonобъективные причины как сумма влияний на концепцию интерфейса, от логики функций до эстетики и кончных впечатлений

Исследование тематических материалов

Ментальное внедрение, восприятие пользователя через глубокое сопоставление себя

Принятие. Какие стереотипы существуют, что знают о продукте и функции пользователи, принятые паттерны поведения и знакомые метафоры

Разработка первичного прототипа учитывающего все привычные паттерны и сценарии пользователя

Интеграция новых возможностей в первичный прототип, реализация функциональных и информационных приоритетов

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

UX проектирование

UX проектированиебрендинговые коммуникации / проектирование интерактивной платформы / usability and desirability визуализируем желания

структурная система проектирования коммуникации бренда в цифровых медия (сайт, аппс, экранные презентации и инсталляции)

topline навигационный блок основных проектов (смежные промо-сервисы) базовая навигация

leadgenerator блок стимулирующий вовлечение/действие пользователя, обещание выгоды

эмоциональная зона / реализует впечатление стиля, идентификаторов бренда, атмосферы и элементов позиционирования

demo демонстрация продукта /сервиса, визуальные атрибуты демонстрирующие

обладание и функции, возможные дополнительные опции и SKU

RTB / рациональный блок, прагматичная демонстрация выгод от использования и

преимуществ

social media / интеграция возможностей социальных медиа

consumer corner / потребительский блок / форма регистрации / контактная информация, форма поиска, вход для постоянных клиентов / корзина покупок

footer / юридическая информация, контактная информация,

Процесс

брифинг встреча с клиентомпостановка задачи определение цели проекта

анализисследование возможностей решения задачи

креативный процессгенерация идей и творческих концепций

презентацияподтверждение концепции

реализациятехническое исполнение

правки корректировкатехническое исправление

публикациязавершение проекта

разработка UXинтерфейс

визуальный дизайн

разработка кодинг

технологический тестэксперимент с потенциально возможным использованием технологии стимулирующий возможности креативного процесса

Дмитрий Карпов 2012г

потребность

мотив

импульс

стимул

вовлечение

эмпатия

активация / решение / шаринг

проактивное действие

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

обратная связь

использование мотива личности, опредмечивание мотива в вербальном и визуальном

пространстве

создание визуального импульса инстинктивного, понятного в

секунду контакта, фиксирует внимание

стимуляция личностного интереса, раскрытие

удовлетворения мотива

расширение интереса сценариями разной активности, игр, конкурсов,

актуальный контент, скидки

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

кино, сервис, оформление заказа, завершение потребительского цикла

создание сюжета осознанного сопереживания эмоциональному

состоянию персонажаподтверждение принятого личного решение, (заполнение формы, регистрация участника акции) стимуляция распространения информации участником, ознакомление ближнего круга, используем мотивы просоциальные и самоутверждения

техническая модель

визуальная интерпретация

вербальная интерпретация

социальная интеграция

психологическая механика

задача клиента репрезентация задачи с позиции пользователя

реальный срок

набор обязательных

образов творческая интерпретация образа реализации мотива (показать власть над объектом, подчеркнуть престиж, демонстрация личного достижения, идентифицировать личность с героем)

% реализуемость модели

реализуемость визуальной коммуникации и технической

интерактивной модели

прогнозируемая реализация мотивов психологической

механики

маркетинговая воронкапринцип формирования отношения потребитель&продукт

AwarenessAcceptance

LoyaltyRetention / Preference

Advocacy

Accumulation

Awareness — узнавание названия бренда и его принадлежность к категории.

Acceptance — принятие бренда. То есть, потребитель не отрицает возможности приобретения.

Trial — пробная самостоятельная покупка.

Retention / Preference — потребление товара или услуги по рациональным причинам (цена, акции, наличие в ближайшем магазине и пр.) на постоянной основе.

Loyalty — потребление по эмоциональным причинам. Меньше зависит от цены,

дистрибуции и других объективны факторов. Advocacy является следствием работы с лояльностью и приводит к распространению положительных рекомендаций (word of mouth)

Accumulation — накопление знаний и опыта потребления товаров бренда, что приводит к желанию пользоваться любыми товарами, доверяя качеству (рационально) и характеру бренда (эмоционально) является следсвием работы коммуникаций не только ориентированных на потребителя, независимые media материалы.

AwarenessAcceptance

LoyaltyRetention / Preference

Advocacy

Accumulation

Awareness

Acceptance

Loyalty

Retention / Preference

Advocacy

Accumulation

Awareness

Acceptance

Loyalty

Advocacy

Accumulation

Awareness

Acceptance

Loyalty

Advocacy

Accumulation

http://graphicnovel-hybrid4.peugeot.com/start.html

Awareness

Acceptance

http://www.sound.philips.com/

Awareness

AcceptanceTrial

дополнительный фактор убежденияминимальный риск

дополнительный фактор убеждениякачество / демонстрация

Try to Buy

Awareness

Acceptance

узнавание «...кстати, вот что посмотрю»

возможно «интересно... нравится»

хочу «уверен, мне подхолит»

вот бы мне такие «офигительно смотрится»

Тайна профессии: Меньше слушай советов, больше пробуй сам

Тайна профессии: Читай в день по заметке о технологии

Тайна профессии: Пять лет назад устройство типа IPad было фантастикой, сегодня у многих, завтра у всех

Тайна профессии: Не спрашивай у пользователя мнения, дай ему готовый продукт

Тайна профессии: Лучше спорить прототипами

https://vimeo.com/47875656

Огонь. Молоты. Таланты

Design

PwC: Таланты и инновации

МОЛОДЫЕ ТАЛАНТЫ — 2015 · МОЛОДЫЕ ТАЛАНТЫ — 2015 Ãàò÷èíà 2015 ÏÎÁÅÄÈÒÅËÈ È ËÀÓÐÅÀÒÛ ÃÀÒ×ÈÍÑÊÈÕ ÌÅÆÐÅÃÈÎÍÀËÜÍÛÕ

Как находить таланты, разрабатывая профиль успехов

"Осторожно огонь!", Кершева Н.В

Cl GPN-Умножая таланты- учебник финала

4 «В» встречает олимпийский огонь

Конкурс "Таланты среди нас"

Юные таланты Московии 2017

Огонь друг или враг

Сборник Перекрестный огонь (2 этап)

Памяти негаснущий огонь

Огонь - друг или враг?

проект таланты можно воспитать

огонь друг и враг

Молодые таланты – привлечение и развитие

Внутренний огонь

Книга 07. Внутренний огонь

ОГОНЬ, ОПРЕДЕЛЯЮЩИЙ ИНТЕРЬЕР · 2016. 3. 23. · частью вашего дома и элегантным дополнением комнаты. Огонь

КОНКУРС ЮНЫЕ ТАЛАНТЫ МОСКОВИИ Школа 668 ...nkosterev.narod.ru/mos/pvd/rebrova.pdf · 2017. 8. 27. · КОНКУРС «ЮНЫЕ ТАЛАНТЫ МОСКОВИИ»

фестиваль педагогических идей «таланты московии»