Меню като цип
Навигацията се отваря като цип, пренасяйки характерен детайл от дрехата в интерфейса.
КЕЙС СТЪДИ · E-COMMERCE
ASSEMBLED
ASSEMBLED
Дигитален магазин, ушит по мярка
Превърнахме идентичността на Assembled в интерактивно e-commerce изживяване, в което всеки детайл следва характера на бранда.
UX/UI Design
E-commerce
Custom Development
Motion Design
БРАНДЪТ
Една дреха.
Една дреха.
Много възможности.
ASSEMBLED е моден бранд, изграден около идеята за модулното облекло. Дрехите не следват една единствена форма, а се променят според начина, по който ги носиш.
Всеки елемент може да бъде трансформиран, комбиниран и интерпретиран по различен начин. Сайтът трябваше да носи същата свобода - ясен, интуитивен и фокусиран върху самата дреха.
CUSTOM DEVСайт, изграден от нулата
E-COMMERCEЦялостно онлайн пазаруване
UX / UIДизайн, създаден за ASSEMBLED
ЗАДАЧАТАМодулен продукт.
Модулен продукт.
Разпознаваемо дигитално преживяване.
ПОСОКАТА НА ПРОЕКТА
ASSEMBLED се представя като първия модулен български бранд. Задачата ни беше да откроим тази концепция в онлайн магазина и да я направим разбираема през самото разглеждане. Детайлите трябваше да подсказват възможността да сглобяваш, променяш и носиш дрехата по свой начин, като запазят удобния избор и покупка.
ХАРАКТЕРФУНКЦИЯ
КОНЦЕПЦИЯ · MOTION SYSTEM
Детайлите оживяват.
Вдъхновихме интеракциите от конструкцията на дрехите и ги превърнахме в част от дигиталния език на ASSEMBLED.
Селекции като закопчаване
Копчето се превръща в начин за достъп до детайлите на дрехата. При отваряне то среща своята „дупка“ в края на менюто.
Колекция под прожекторите
Силуетите са първата точка на контакт с колекциите. Всяка зона от тялото води към различна част от ASSEMBLED.
CUSTOM ICONS
Един визуален език до последната икона
Самостоятелни знаци, родени от същата геометрия и конструктивна логика, заложени в логото.
ВИЗУАЛНА СИСТЕМА
Езикът на ASSEMBLED.
Черно, бежово и почти бяло изграждат балансирана палитра с мек контраст. Цветовете не се конкурират с дрехите, а създават чист фон за тях.
#1B1816Основен контраст
#C9A792Акцент и действие
#FFFDFAФон и въздух
BRAND TYPEFACEManrope
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz · 0123456789
INTERFACE CONTROLS
Цветове и пропорции, извлечени от live ASSEMBLED storefront.
ФОТОГРАФСКИ СТИЛ
PRODUCT UXПо-ясно представяне.
По-ясно представяне.
По-уверено решение.
Изчистеното представяне, логичната структура и лесният достъп до важната информация превръщат избора в приятно изживяване.
ЦВЯТ И РАЗМЕР
Вариантите са подредени така, че изборът да става с един поглед.
ЛЕСНО ДОБАВЯНЕ
Бутонът за количката е на видно място до избрания продукт.
ПОДРЕДЕНИ ДЕТАЙЛИ
Допълнителната информация се разгъва при нужда.
УПРАВЛЕНИЕКрасив отвън.
Красив отвън.
Удобен отвътре.
Съдържанието на продуктовите страници може лесно да се редактира и допълва според нуждите на всеки продукт и категория.
СъздаванеПродукт и варианти
→
ПубликуванеПроверка и статус
→
УправлениеНаличности и съдържание
КЛЮЧОВИ РЕШЕНИЯ
Лекота във всяко действие.
Модулността в интерфейса
В стандартен онлайн магазин особеността на продукта може да остане само изречение в описанието.
→Пренесохме характерни детайли от дрехите в сайта: навигация, която се отваря като цип, и взаимодействия, вдъхновени от закопчаването. Така идеята на бранда присъства и в начина на използване.
Отличимост без разсейване
Анимациите трябва да подчертават продукта, без да затрудняват ориентацията или да конкурират основното съдържание.
→Използвахме акцентните взаимодействия в конкретни моменти. Категориите, продуктовата информация и пътят към количката запазват ясна логика, докато характерът на ASSEMBLED се разпознава в детайлите.
Яснота при избора
Човек трябва да разбере възможностите на продукта и да избере вариант, размер и цвят, без отличителната визия да усложнява покупката.
→Подредихме основните варианти и действието за добавяне в количката на видими места. Допълнителната информация се разгъва при нужда, за да се запази фокусът върху избора.
БЪРЗИНА И ОПТИМИЗАЦИЯ
Визия, която
Визия, която
идва навреме.
Продуктовите изображения и анимациите придават характер на магазина. Ресурсите се зареждат в точния момент, за да остава разглеждането плавно.
90
Ефективност96
Достъпност100
Най-добрипрактики
100
SEO- Оптимизирани изображения
- Зареждане на изображения при нужда
- Премерено зареждане на анимациите
- Оптимизиран обем на ресурсите
PageSpeed Insights / DesktopPageSpeed Insights резултати за ASSEMBLED.
RESPONSIVE
Адаптиран към всеки екран.
Композицията се променя според пространството, но визуалната идентичност остава разпознаваема и последователна на всяко устройство.
Въпросите след пускането.
Разговор с Павел, основател на ASSEMBLED - за идеята, съвместната ни работа и готовия сайт.
Какво искаше да постигнеш с новия сайт и какво беше най-важно за теб?
Най-важното нещо за мен беше сайтът да бъде изготвен така, че да се отличава от повечето други сайтове и да се запомни от потребителите. Търсех нещо ново, нестандартно и иновативно като изготвяне и смятам, че успяхме да го постигнем.
Как би описал работата с нас – от първия разговор до готовия уебсайт?
Изключително лека и приятна комуникация, бързо откликване на въпросите, които имах, и готов краен продукт, който със сигурност отговори на очакванията ми.
Имаше ли конкретен момент, идея или наше действие, което ти направи особено добро впечатление?
Най-добро впечатление ми направи това, че подходът още в началото беше много топъл и впоследствие приятелски. Бяха изслушани всичките ми желания, които имах, и след това бяха реализирани така, както си ги представях.
Какво в крайния резултат те зарадва най-много и защо?
Най-много ме зарадва цялостната визия на сайта, когато беше вече готов, защото не очаквах, че ще може да се изработи всичко, което исках, и да се получи толкова добре.
Ако някой те попита дали да работи с нас, какво би му казал?
Аз вече ви препоръчах и бих го направил отново, разбира се. Радвам се, че именно аз съм един от първите ви проекти, които изготвихте, и определено бих се доверил на вас и занапред.
РЕЗУЛТАТ
Система, готова да расте заедно с бранда
Продуктът, съдържанието и продажбите работят в една ясна и последователна система.
Един общ дигитален език.
От първото движение до управлението на продуктите — всяка част работи като елемент от една система.
Вижте проекта на живо ↗E-commerce основа
Цялостен магазин с ясен път до покупка.
UX/UI система
Собствен интерфейс за desktop и mobile.
Motion и икони
Разпознаваеми детайли с конкретна функция.
Управление
Практична среда за продукти и съдържание.
СЛЕДВАЩ ПРОЕКТ
Имате продукт,
Имате продукт,
който не се побира
в готов шаблон?
Нека му направим собствена система — от първия жест до последния клик.
