en

BRASLETI – bracelet manufacturing company

Go to website

Bracelet manufacturer

  • Site type: website catalog
  • Niche: production
  • Terms: 14 days
  • Status: Completed
  • Made: Ui/Ux, Web dev

01 Client

BRASLETI – a company that makes wristbands out of paper, fabric, vinyl, and silicone. Their wristbands are popular in hotels, nightclubs, and festivals

02 Goals and objectives

Develop a website catalog that will contain a detailed description of our products and present our work
  1. Do a photo shoot of our products
  2. We want to see the site in yellow or red
  3. On the bracelets page, it must be possible to display the color palette and the availability of a certain color
  4. We want to see a bright portfolio page with clear photos of the bracelets we have made
  5. The contact page must have a manager's contact information linked to a specific region
  6. The site loading speed from different devices should not be longer than 3 seconds
  7. Applications from the site must be sent to all managers by email and to the site's administrative panel

03 Decision

First of all, we ordered a photographer to take photos of the products, since we needed to use real photos for the design. After that, we created the website design and implemented all the functionalities.

Website design

Disney was developed according to the client's wishes and the technical specifications received. Basically, the client wanted to see a bright site with a clear block structure.

Colors

Colors

Fonts

Open Sans Medium
Open Sans Regular
Bebas Neue Regular
Photos of some sections
Site photo Brasleti - 1
Site photo Brasleti - 2
Site photo Brasleti - 3
Site photo Brasleti - 4
Bracelet catalog
One of the most important pages on the site was the bracelets category. It schematically depicted all the types of bracelets and how they work. This page is shown in the photo below.
Site photo Brasleti - 1
Site photo Brasleti - 2
Site photo Brasleti - 3
Schematic representation of bracelets

Mobile version

Our team worked on the design not only for computers and laptops, but also took care of the design for mobile devices (tablets and phones).

Mobile version photo Brasleti 1
Mobile version photo Brasleti 1
Mobile version photo Brasleti 2
Mobile version photo Brasleti 2
Mobile version photo Brasleti 3
Mobile version photo Brasleti 3
Mobile version photo Brasleti 4
Mobile version photo Brasleti 4
Mobile version photo Brasleti 5
Mobile version photo Brasleti 5

Website development

The features of this project during the development of client programming of the site include non-standard placement of blocks, wave animation on the pages and the appearance of the product catalog itself.

Roman Melnychuk

Site animation

The animation on the site is played when scrolling the page, hovering over certain elements, flipping the slider, etc. Therefore, I suggest you watch the video to see how it all happens.

Blocks in the portfolio

A special feature of these blocks is that each bracelet has its own background, from which it is separated. When hovering over a certain block, a pseudo-3D animation is observed.

Slider

To implement the slider, the Slick library was used. On each individual slide, you can place additional elements for the background. In addition, the background itself changes its color for each individual slide. We made sure that each spider setting could be changed independently in the site's administrative panel

Bracelet type

Each bracelet page has information about the bracelet's sizes and a schematic representation of them, the color palette, and information about the main parts of the bracelet.

Back-end

The main feature of the project was the ability to add an unlimited number of branches and managers to the contact information page. This, one of the main tasks, did not cause us any difficulties.
Dmytro Kosyk

Working with the admin

The admin panel provides full editing capabilities for information on the site, as well as a breakdown into 2 language versions: Ukrainian and Russian.

Branches and manager contacts

A complex structure of branches and managers has been designed and developed. Through the site management system, the ability to add any number of branches, managers, and various numbers of manager contacts has been implemented.

Bracelet structure

Added the ability to change the structure of the bracelet, which allows you to edit it without involving programmers and layout designers.

Bracelet gallery

Also, the ability to edit: project palette galleries and bracelet portfolios was created.

Telegram API integration

All data from contact forms is sent directly to Telegram, where managers can instantly see all the client's information and contact them.

04 Technologies and tools

jQuery
Modx Revolution
Gulp
Figma
MySQL
PHP
LESS
Telegram API

05 Result

At this stage, the site is fully completed and tested. The site is on a subdomain, as the client initially wanted to test it in advertising before transferring it to the main domain. We also created a document with instructions on how to use the administrative panel and sent it to the client along with all accesses to the project.

Roman Melnychuk

06 Client's words about the project

Review author: Andrii Davydov
Andrii Davydov

Founder

07 Project team

Project management

Roman Melnychuk

Marketing

Design

Development

Content

Are you impressed by this project?
Then rate it!

Other projects

Are you interested in developing a website for a manufacturer?

Leave a request for feedback, we can surprise you.