Редизайн сайту школи та майстерні з пошиття одягу

Шовкова Майстерня — школа та майстерня Тетяни Шовкової, конструктора-модельєра з понад 20-річним досвідом. Тут можна навчитися шити з нуля, поглибити свої навички, пройти окремий курс або прийти з конкретною задачею, наприклад, навчитися працювати з верхнім одягом і пошити власне пальто.

Сайт як продовження Майстерні

Попередній сайт уже не відповідав тому, якою була Майстерня насправді. Він виглядав досить строго та стримано, тоді як сама Тетяна активно розвиває блог, багато спілкується з аудиторією та постійно показує процес роботи, навчання і результати студентів. Хотілося, щоб сайт нарешті передавав цю енергію і відчувався частиною того самого бізнесу, який люди бачать у соцмережах.

При цьому Майстерня має багато різних напрямків, тому важливо було не просто оновити візуальну частину, а зрозуміло організувати всю інформацію. Сюди приходять і ті, хто вперше сідає за швейну машинку, і люди з досвідом, які хочуть опанувати складніші техніки, пошити конкретну річ або отримати професійну консультацію. При цьому зберегли живу атмосферу самої Майстерні.

Головна сторінка та навчання

Ми почали з того, щоб зібрати в одному місці все, за чим люди приходять до Шовкової Майстерні. Головна сторінка знайомить із Тетяною та її досвідом, показує атмосферу майстерні, формати навчання, послуги, роботи студентів і відгуки. При цьому вся інформація побудована так, щоб людина могла швидко зрозуміти, що їй підходить, і перейти до запису.

Перший екран одразу задає напрям: «Шити одяг, який хочеться носити». Поруч показали живі кадри з майстерні, а нижче коротко винесли основні цифри та досвід школи.

Один із центральних блоків присвятили чотирьом основним форматам навчання: «Основи крою та шиття», онлайн-курсу «Початківець», «Конструкції верхнього одягу» та індивідуальним заняттям. Для кожного формату є фотографія, короткий опис, вартість і перехід на детальну сторінку. Так можна одразу побачити різницю між програмами та вибрати свій варіант.

Формати розраховані на різний досвід і спосіб навчання. Хтось приходить зовсім без підготовки й починає з основ, хтось уже шиє та хоче розібратися з конструкціями верхнього одягу, а комусь потрібна індивідуальна робота над конкретним виробом. Є й формат ательє, де студент працює над однією моделлю та проходить повний професійний цикл її створення.

Крім основних програм, на головній сторінці можна показувати актуальні курси та мінікурси, наприклад «Сарафан з нуля». Такі блоки легко оновлювати залежно від поточного набору.

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

Так головна не перетворюється просто на каталог навчання. Вона поступово знайомить людину з Майстернею, допомагає визначитися з форматом і веде далі до потрібної сторінки.

Візуальний стиль

У редизайні ми відійшли від стриманої подачі попереднього сайту. Там основою був глибокий зелений фон, а теплий золотистий використовувався для акцентів. Нову версію хотілося зробити світлішою, активнішою та ближчою до самої атмосфери Майстерні.

У логотипі ми вирішили зберегти те, що вже працювало, але трохи освіжити його подачу. Знак залишили без змін, бо він уже був впізнаваною частиною айдентики. А от шрифтову частину оновили: зробили її простішою та легшою, замінивши попередній шрифт на сучасний гротеск. Так логотип краще поєднався з новою типографікою сайту й загалом став виглядати свіжіше.

Разом із логотипом оновили й фірмову палітру. Основним акцентом став теплий рудий. Він виглядає живіше та енергійніше, а ще має прямий зв’язок із Тетяною: її руде волосся давно стало частиною впізнаваного образу. Тому цей колір природно став однією з характерних деталей бренду.

У новому дизайні рудий з’являється точково, у кнопках, навігації, окремих словах і невеликих графічних деталях. Основу сторінок складають світлі фони та великі темні блоки, які створюють контраст і допомагають структурувати велику кількість інформації.

Сторінка побудована на зміні масштабів і ритму. Великі заголовки та фотографії чергуються з картками курсів, темними інформаційними блоками, статистикою, відгуками та невеликими деталями. При цьому самі компоненти залишили досить простими, щоб велика кількість інформації легко читалася.

Особливо це важливо для навчальних програм. У картці одразу видно назву курсу, для кого він підходить, короткий опис, вартість і перехід до детальної сторінки. Такий самий принцип працює для послуг та інших розділів сайту.

Мобільну версію побудували за тією самою логікою. Великі блоки перебудовуються у вертикальну структуру, а списки курсів і послуг відкриваються у зручному форматі з короткими описами.

Так ми зберегли впізнаваність Шовкової Майстерні, не змінюючи логотип, але повністю оновили його кольорове та візуальне середовище. Новий сайт став світлішим, живішим і значно ближчим до реальної атмосфери школи та майстерні.