Project Screenshot

Kopi-d Co.

Супер быстрый и легковесный, оптимизированный под СЕО онлайн магазин. Основной продукцией которого являются устройств быстрой зарядки смартфонов и прочих аксессуаров, а так же маяков и станций для умного дома.

  • The story behind Kopi-d Co.

    Kopi-d - компания разрабатывающая дизайн и производство мобильных аксессуаров, а также маяков и станций для умного дома. Компания была основана в 2008 году и успешно ведет свою деятельность до текущего момента, ее руководитель компании Sam AU связался с нами и попросил помочь увеличить долю продаж онлайн своей компании и разработать быстрый и легковесный онлайн магазин

  • Analysis

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

  • Our solutions

    Мы разработали удобный и быстрый онлайн магазин, позволяющий приобрести уникальную продукцию компании kopi-d не выходя из дома на любом континенте. Одним из достоинств разработанного решения является скорость работы, удобный админский интерфейс для отслеживания заказов и автоматический расчет цены доставки в зависимости от адреса покупателя

Results

Duration:
April 2016 - May 2016
Team:
Backend - 1 Frontend - 1 PM - 1
Designed the UI/UX

В приложении существует три роли пользователей: клиенты, модераторы и супер-администраторы. Мы определили мокапы и вайфреймы для каждой из этих ролей и затем использовали эту информацию для создания подробных макетов интерфейса. Важным аспектом работы была дружественность интерфейса для мобильных устройств

Developed the backend

Мы выбрали REST API для бэкэнда, потому что эта архитектура гибкая, простая и расширяемая. Мы предоставили понятный интерфейс администратора, чтобы наш модератор мог управлять содержимым сайта всего за несколько кликов. Сразу после внесения изменений в бэкэнд они становятся доступны пользователям без задержки сервера. Администратор может легко за пару кликов изменять заголовки, тексты, изображения, значки и цветовые схемы. Мы использовали Redis RAM кеширование, чтобы ускорить время отклика API и процесс завершения заказа. Также был разработан гибкий модуль для автоматического вычисление цены доставки в зависимости от страны, адреса пользователя и выбранной службы доставки

Developed the frontend

Этот проект был довольно маленьким, и у нас был строгий срок исполнения, по крайней мере, для клиентской части приложения. Поэтому мы решили создать сверхлегкую, быструю и оптимизированную для SEO фронтенд часть магазина. Для стека технологий мы решили использовать нативный JS - он очень быстрый и очень легкий. В результате у нас всего менее 30 Кбайт всего кода JS, CSS и HTMl для нашего интернет-магазина, работающего без перезагрузок страниц (в стиле одностраничного приложения) что очень положительно сказалось на поведенческих факторах.

Implemented features

Как только клиент выполнит заказ и предоставит информацию, он сможет произвести оплату через PayPal. Клиенты могут платить с помощью Payflow Pro, открытого и безопасного шлюза PayPal для платежей PayPal и кредитных / дебетовых карт.

Мы рассчитываем стоимость доставки автоматически на основе почтового индекса клиента. Для этой функции мы используем стороннее АПИ и внедрили наш модуль предварительного расчета, чтобы сделать процесс заказа максимально быстрым и удобным для наших клиентов.

Изначально мы решили использовать рассылку смс при помощи сервиса Twilio. Крайне важно было использовать проверенный сервис, Twilio должен был обеспечить стабильную скорость доставки. Но после того, как мы вышли в лайв, мы увидели, что многие сообщения не были доставлены на некоторые номера и даже некоторым телекоммуникационным провайдерам (часть провайдеров Китая). Мы постарались решить эту проблему, связывались с техподдержкой Twilio. Мы добавили буквенно-цифровые идентификаторы отправителей, которые необходимы для SMS-сообщений, но ничего не помогло. Затем мы переключились на другой сервис доставки SMS-сообщений. Мы выбрали SMSAla на основе отзывов и цен. И он работал хорошо для китайских пользователей

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

Если у посетителей есть вопросы, они могут легко связаться с нами. После того как посетитель отправляет запрос на сайте - в админской панеле, генерируется запрос, а также отправляется уведомление по электронной почте менеджеру по продажам интернет-магазина KOPI-d.

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

Мы разработали удобный интерфейс для управления всеми заказами и учетом всех пользователей. Наша серверная сторона автоматически отправляет запросы на сервис доставки для определения актуального статуса заказа. Пользователь может в режиме реального времени отслеживать статус заказа на нашем сайте

Technology Stack

HTML5 icon
HTML5
CSS3
Javascript icon
Javascript
Node icon
NodeJS
PostreSQL icon
MongoDB
Nginx icon
Nginx
Paypal icon
Paypal
Rest API
Rest API