Шаблоны и инструкции

Разработка эскиза сайта

Шаблон задачи

Заголовок

Разработать эскиз сайта

Компонента

Дизайн

Текст

Текущий сайт(при наличии) ― http://
Прототип (при наличии) ― http://
Заполненная анкета от клиента ― Анкета
Структура сайта ― http://
Анализ конкурентов ― http://

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

Эскиз ― это черновой вариант(концепция) будущего макета, а не готовое решение.

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

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

https://habr.com/ru/companies/kokocgroup/articles/878028/

https://drawcon.ru/skillup/article/trendy-veb-dizayna-2025-goda

https://dsgners.ru/ux/8269-trendyi-veb-dizayna-na-2025-god-prognozyi-ot-jyuri-awwwards

https://inostudio.com/blog/articles-design/trendy-ux-ui-2025-kak-ne-zalipnut-v-proshloe/

Эскиз должен содержать:

1. Внешний вид основных блоков сайта на примере одного или нескольких для демонстрации UI-решения и направления в стилистике.
2. Цветовое решение на примере палитры из основных цветов.
3. Отображение сочетания шрифтов.
4. Подробное аргументированное описание UI-решений.

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

____________________________________________________________________

Идея эскиза заключается:
«Текстовое описание идеи (можно несколькими пунктами)»

При разработке были использованы глобальные тренды дизайна:

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

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

2. …

3. …

____________________________________________________________________

Пример корректной демонстрации эскиза: clck.ru/3MYeuW

Эскиз и скриншоты с примерами использованных трендов предоставляются в формате PNG.Также прикрепляется исходник со ссылкой на эскиз в Figma.

Примеры

Пример эскиза 1

  • Пример эскиза, где дизайна немного недостаточно:

Пример эскиза 2 не хватает меню, вставки логотипа в шапку, но, в целом, тоже нормально и устраивает.

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

Пример эскиза 3

Пример эскиза 4

Пример эскиза 5

Пример эскиза 6