Как создавался
новый Narrative Studio

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

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

Narrative Studio — это имя которое работает на любом языке, легко входит в разговор и оставляет пространство для смысла, а не навязывает его заранее.

Простота, основательность, надёжность — три слова, которые легли в основу стиля Narrative Studio. Не как декларация, а как рабочий инструмент: если решение не проходит эти три фильтра, оно не попадает на сайт.

Движущая сила стиля — простая геометрия, насыщенные линии, много свободного пространства. Ощущение того, на что можно опереться. Это не модный тренд — это выбор делать вещи, которые не устаревают.

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

Когда мы начали проектировать обновлённый сайт, сформулировали три задачи — не требования клиента, а наши собственные критерии успеха:

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

Каждое дизайн-решение проверялось на соответствие хотя бы одной из этих задач. Если не проходило — убирали.

Стив Круг в книге «Не заставляйте меня думать» объясняет, что пользователи не читают веб-страницы — они их сканируют. Они ищут то, что соответствует их задаче прямо сейчас, и пропускают всё остальное.

Пример адаптирован из главы 2 книги Стива Круга «Don't Make Me Think, Revisited»

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

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

Вайрфреймы — ценный инструмент для исследования решений, но они не должны ограничивать финальный дизайн.

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

Три принципа которые держали нас в рамках:

1. →Один элемент за раз. Чем больше элементов видно на экране, тем больше работы делает пользователь чтобы понять что из этого ему нужно. Мы ограничили содержимое только актуальным и дали каждому элементу пространство.
2. →Анимация — только там где нужен следующий шаг. Анимация должна направлять, а не отвлекать. Мы анимируем только то, с чем хотим чтобы пользователь взаимодействовал дальше.
3. →Никаких тяжёлых форм и ярких акцентов. Крупный лёгкий шрифт на почти чёрном фоне, минимум визуальных элементов которые конкурируют с текстом за внимание пользователя.

На главной странице Narrative Studio нет слова «дизайн». Нет слов «разработка», «инжиниринг», «копирайтинг». При этом всё это — очевидно важные части того, что мы делаем.

Причина простая: это входные параметры, а не результаты. Мы хотим чтобы посетители почувствовали потенциал партнёрства с нами — а это ощущение не вызывается перечнем дисциплин.

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

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

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

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

Особое внимание — мобильным устройствам. Навигация открывается внутри страницы: контент сдвигается, меню появляется снизу в зоне большого пальца. Закрыть можно свайпом вверх — интуитивно, без лишнего UX-объяснения. Переход между страницами маскирует предыдущий контент и плавно загружает следующий. Так перемещение по сайту ощущается как навигация внутри одного приложения, а не переход между документами.

Запуск нового Narrative Studio — наиболее чёткое выражение того, что мы умеем и что считаем важным. Не заявление о намерениях, а работающий продукт.

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

Мы открываем как можно больше из нашей работы для дизайнерского и технологического сообщества. Если эта статья была полезной — следите за нами. Впереди — больше.