LookAtBaby

Главное о кейсе

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

Как проект изменил жизнь пользователей

Сайт запущен, заказчик очень положительно оценил работу.

Бизнес-задача и ее решение

Создатели LookAtBaby стремились сделать такой сервис, который помогал бы родителям без лишних усилий одеть ребенка. Речь, конечно, не про «не хочу-не буду одеваться» — тут мы, увы, бессильны.

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

Чтобы ребенок сам или вы вместе с ним могли бы подобрать одежду. И это бы выглядело не так, будто он упал в коробку с мультяшными аппликациями.

Чтобы каждый новый этап его жизни, каждый важный момент ассоциировался с эстетикой и стилем.
С такой задачей и пришли к нам заказчики.

Крафт (мастерство), реализация, технические детали

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

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

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

Так что мы подобрали подходящие референсы и согласовали их с заказчиком. Затем мы выявили паттерны этих референсов — минимализм, спокойные оттенки — и начали работать над дизайном сайта.
Мы стремились создать интерфейс, полностью соответствующий стилистике бренда LookAtBaby. Он должен был ассоциироваться со словами «нежный», «светлый» и «добрый».

Для этого мы использовали пастельную гамму природных оттенков и мягкие формы и линии.
Мы тщательно продумали UI-kit, в который вошли:
лаконичный спокойный шрифт Futura PT Book без засечек, яркий представитель эстетики школы Баухаус 1920–1930-х годов;
приглушенные природные оттенки, перекликающиеся с цветовой гаммой товаров;
лаконичные кнопки и немного «детское» — неровное — начертание стрелок переключения.

Инсайты, гипотезы, процесс создания и взаимодействия с заказчиком

Поскольку сервис LookAtBaby организует консультации и поддержку, особое внимание мы уделили разделу с инструкциями для заказа и форме обратной связи. В них нет ничего, отвлекающего пользователя от заказа. Только полезная информация и три поля для заполнения: «Имя», «Номер телефона» и опциональное «Дополнительная информация».
Поскольку сайт был одностраничным, мы не использовали фреймворки для фронтенда. Мы взяли index.html с разметкой страницы, а для стилей использовали распространенный шаблонизатор в верстке .scss. И для добавления динамики взяли javascript.

Прочая информация о кейсе

The creators of LookAtBaby sought to make a service that would help parents dress their child without any extra effort. This, of course, is not about “Oh no, I don’t want to get dressed” — here we, alas, are powerless.

The essence is in the compatibility, style and relevance of children's clothing and the development of kid’s independence.

So that the child himself could choose clothes. And it wouldn't look like he or she fell into a box of cartoon appliques.

So that every new stage of his life, every important moment would be associated with aesthetics and style.

With this task, customers came to us.

Design and technologies


To create the design of the service, we plunged into the study of parent-child relationships and competitor sites. We reread Turgenev, the works of child psychologists, looked at services with a similar potential audience.


And we realized that parents are very worried about what surrounds the child. Because all this things are involved in its formation in the broadest sense: clothes, toys, room. The brain of a child, absorbing like a sponge, remembers absolutely everything.

And parents striving for this want to see such products not on the fussy and gaudy pages of the site, but harmoniously integrated into an aesthetic and concise design.

So we selected suitable references and agreed them with the customer. Then we identified the patterns of these references - minimalism, calm shades - and began to work on the design of the site.

We tried to create an interface that is fully consistent with the style of the LookAtBaby brand. It was supposed to be associated with the words "gentle", "light" and "kind".

To do this, we used a pastel range of natural shades and soft shapes and lines.

We carefully thought out the UI-kit, which included:
laconic calm font Futura PT Book sans-serif. It is a bright representative of the aesthetics of the Bauhaus school of the 1920s and 1930s;
natural muted color palette, echoing the colors of the goods;
minimalistic buttons and a slightly “childish” style of the switch arrows.
Since the LookAtBaby service organizes consultations and support, we paid special attention to the section with order instructions and the contact form. There is nothing that distracts the user from the order. Only useful information and three fields to fill in: "Name", "Phone number" and optional "Additional information".

LookAtBaby is a one-page site, so we didn't use any front-end frameworks. We took index.html with the page markup, and for styles we used a common layout template engine .scss. And to add dynamics, we used javascript.

Скриншоты