Обговорити ваш проєкт
Проєкти / Персоналізація товарів

CaseShop Constructor

Браузерний конструктор персоналізованих чохлів.

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

01 / Вибір продукту

Модель телефона визначає основу для дизайну.

CaseShop Constructor: Стартова сторінка

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

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

CaseShop Constructor: Основа та колір

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

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

02 / Зображення, декор і текст

Фото, декор і типографіка в одному редакторі.

CaseShop Constructor: Редактор фотографії

Редактор фотографії

Фоторедактор підтримує завантаження, розміщення, обертання та зміну розміру зображення на вибраному чохлі. Кожну зміну видно на прев’ю товару.

CaseShop Constructor: Декоративні елементи

Декоративні елементи

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

CaseShop Constructor: Текст і шрифти

Текст і шрифти

Параметри тексту задають шрифт, колір і стиль поруч із прев’ю товару. Бібліотека типографіки проєкту містила понад 600 шрифтів Google.

03 / Дизайн і замовлення

Готовий дизайн залишається поруч із даними замовлення.

CaseShop Constructor: Оформлення замовлення

Оформлення замовлення

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

Технології

Технології CaseShop Constructor.

Редактор у браузері, серверний застосунок і сховище файлів для персоналізації товарів.

Редактор дизайну

AngularJS і TypeScript забезпечують роботу інтерфейсу в браузері, SCSS — його оформлення.

  • AngularJS
  • TypeScript
  • SCSS

Сервіси застосунку

Серверний застосунок побудований на C#, Microsoft .NET та ASP.NET MVC.

  • C#
  • Microsoft .NET
  • ASP.NET MVC

Записи та файли

T-SQL, Entity Framework Core і Dapper забезпечують доступ до даних. Azure File Storage використовується в інфраструктурі зберігання файлів.

  • T-SQL
  • Entity Framework Core
  • Dapper
  • Azure File Storage

Хостинг і розгортання

Azure Web Application Server та Azure DevOps використовуються для хостингу й розгортання застосунку.

  • Azure Web Application Server
  • Azure DevOps
Ваш товар. Дизайн покупця.

Додайте персоналізацію до процесу покупки.

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

Обговорити конструктор товарів