Comfyco

Інтернет-магазин меблів у США, Нью-Джерсі

Посилання на проект

Мета

Редизайн інтернет магазину меблів Comfyco.

Завдання

  • освіжити логотип
  • редизайн існуючого інтернет магазину
  • адаптивна верстка сторінок сайту
Paul G
comfyco.com

Велика подяка хлопцям і Микиті особисто. Не скажу, що ми дыйшли до кінця нашого проекту без проблем, багато речей доводилося нагадувати по кілька разів, іноді сперечалися, іноді не погоджувалися, але це абсолютно нормально. Мій проект інтернет-магазину був великим, непростим; я точно знав, що хочу бачити на виході, тому що глобально це була 3-тя версія інтернет-магазину; до того ж я людина десь надто уважна до деталей, тому було іноді непросто, але результатом задоволений на 99% – тому що завжди є кілька дрібниць, які можна зробити краще 🙂 .

Можу сказати, що найсильніша сторона Rubika – це прекрасне спілкування, завжди відповідають, ніхто ніколи не пропадає, не випадає на тижні (хоча на кілька днів цілком можуть), завжди є якийсь зворотний зв’язок і навіть якщо ваша проблема не може бути вирішена зараз – вона буде вирішена обов’язково. Нормальне адекватне спілкування в IT, а особливо в пост-радянському IT – це величезна рідкість (є досвід), тому Rubika цінна насамперед цим.

У підсумку можна сказати, що я, звичайно ж, задоволений. До того ж під час цього проекту я особисто багато чому навчився, кілька речей мені хлопці допомогли зробити – що не були обговорені з самого початку – як би безкоштовно за що їм велике спасибі. Прийду я сюди ще раз, якщо знадобиться? Думаю так. Порекомендую я Rubika своїм знайомим, яким потрібен хороший, продуманий сайт – обов’язково. Майте чітке уявлення, що ви хочете отримати на виході, нагадуйте про ті речі, які на ваш погляд повинні бути зроблені певним чином – і все буде добре.

Микиті ж бажаю побільше серйозних клієнтів, уваги до деталей (!), Хороших працівників і терпіння. Проектування сайтів, програмування, спілкування з клієнтами (не всі ж такі няшки як я) – це дуже непростий хліб, і терпіння + адекватне спілкування це, напевно, найважливіше. Професіоналів своєї справи (стосується будь-якої справи), вистачає в будь-якій сфері, але в підсумку завжди все зводиться до того, наскільки тобі приємно мати з цим професіоналом справу. За інших рівних ти завжди вибереш того, з ким тобі приємно спілкуватися.

Історія проекту

До нас звернувся клієнт із завданням по редизайну інтернет магазину меблів під американський ринок. Нам було приємно дізнатися, що свій вибір він зупинив на нас, оскільки в наших роботах ми пишемо чистий код.

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

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

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

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

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

Складність полягала в тому, що зображення мають різні розміри і якість, оскільки в магазині представлені товари різних постачальників.

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

Головна сторінка інтернет магазину ComfyCo

Меню

У процесі роботи було розроблено два меню:

  • класичне в шапці сайту;
  • фіксоване меню, доступне при прокручуванні сторінки.

Також у фіксованому блоці ми залишили ключові елементи навігації – пошук і кошик.

Сторінка категорії

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

Сама ж категорія має наступний вигляд:

  • промо-банер з назвою категорії;
  • фільтр;
  • плитка з товаром;
  • опис категорії;
  • блок з недавно переглянутих товарами.

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

 

Сторінка товару

Одним з найскладніших елементів в даному проекті є сторінка товару, оскільки, потрапивши на певний товар, користувачів може відразу ж купить супутні товари.

Область для основного зображення товару було вирішено зробити квадратним для оптимального відображення зображень різного розміру і співвідношення сторін, а бокову панель закріпити на екрані, в разі, якщо це можливо.

Більшість товарів на зображенні утворюють набори, які гармоніюють між собою. Це не тільки дуже зручно для користувача, адже він може вибрати і ліжко і відповідний до неї приліжковий столик, але і допомагає підвищити середній чек.

Крім цього були розроблено додаткові блоки, які викликають довіру і спонукають користувача зробити покупку або почати взаємодію з сайтом, наприклад:

  • відгуки про товар;
  • можливість задати питання про товар.

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

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

Сторінка товару з комплектами

Сторінка товару інтернет магазину ComfyCo

Страница корзины

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

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

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

Страница стоимости доставки

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

Сторінка помилки 404

Сторінка 404 помилки інтернет магазину ComfyCo

Мобільна версія

При розробці мобільної версії ми зіткнулися з наступними завданнями:

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

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

Ми намагалися максимально зберегти весь функціонал повної версії сайту, подбали про те щоб всі рекламні вікна збереглися. Були перероблені всі блоки головної сторінки по UX мобільного користувача, що дозволило скоротити довжину мобільної версії сторінки.

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

Фільтр

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

Категорія

Для мобільного сторінки категорії ми розробили два варіанти відображення товарів:

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

Обговорити проект

    Google Rating 5.0 Based on 28 reviews
    Telegram Viber messenger email