Eri Verse: Full-Stack Web Store

See the Website: eriverse.com

Overview

The old Eri Verse website was built on a basic Shopify template, which limited customization, looked outdated, and provided a less-than-smooth shopping experience. To modernize the brand’s online presence, I was responsible for building its next-generation e-commerce web store from the ground up.

‍
My role covered both full-stack development and UI/UX design: I designed the shopping flow and user interface to ensure a seamless, user-centered experience, while also developing the front-end and back-end architecture. The new site was built with Node.js, Express, SQL, and Shopify Storefront API, templated with EJS, and deployed on DigitalOcean.

‍
This project demonstrates my ability to deliver end-to-end solutions — from user-focused design decisions to technical implementation and deployment.

‍

Problem Definition

When I first took over the Eriverse project, the main challenges stemmed from the limitations of their existing website. The old site was essentially a low-customization Shopify template, which severely limited branding flexibility and modern design updates. One significant issue was the lack of a clear installation guide: after users received their products, they struggled to find or understand how to install them. The installation instructions were not well-linked to individual product pages, causing user confusion. Additionally, the overall design style of the website appeared outdated, which not only affected user experience but also led to a decline in sales and an increase in user churn. In summary, the core problems included low template customizability, unclear installation instructions, a dated design style, and a lack of competitiveness compared to more modernized competitors' sites.

‍

User Journey Map

‍

Key Feature Pages — Screenshots of the Live Website

‍

Mobile View

‍

Problem / Challenge

The previous Eri Verse website was based on a standard Shopify template. Its outdated visual style no longer matched the brand’s upscale customer base, and the lack of customization limited differentiation from competitors. In addition, installation guides for products were difficult to locate, leading to a frustrating experience when customers attempted to set up their purchases.

‍

Before & After

‍

‍

Goals & Approach

The project aimed to deliver:

• A modern, stylish web presence tailored to the brand’s identity.
• A fully customizable front-end and back-end flow.
• Seamless integration with Shopify’s back office to ensure smooth product management and preservation of existing customer accounts.

Approach:

‍I developed the site in a full JavaScript environment using Node.js for the back end and EJS templates for the front end. Shopify Storefront API was integrated to dynamically fetch product data and manage customer information securely. Hosting and deployment were managed on DigitalOcean to provide a cost-effective, scalable infrastructure.

‍

Development Process

Tech Stack: Node.js, Express, SQL, Shopify Storefront API, EJS, DigitalOcean.

My Role: I independently completed all front-end and back-end development, as well as deployment and server configuration.

Key Development Challenges & Solutions:

• Cart Synchronization: Implemented logic to merge guest cart data with user accounts after login.
• Dynamic Product Updates: Integrated Shopify Storefront API to automatically sync product details and availability.
• Performance Optimization: Applied file compression, caching strategies, and asset fingerprinting to ensure fast load times.
• Responsive Design: Built front-end layouts adaptable to multiple devices and screen sizes.

‍

Key Features

‍

Outcome / Results

‍