Band Music Online Shop and Services UI/UX Design and Development

UX/UI Design
Web Developement
Client

Marching Monk

Region

USA

Brief

Marching Monk is a marching bands digital products and consultations service, providing customers with the whole range of materials they may need:

  • Music design, including customizable ready to set shows, indoor and outdoor arrangements, soundscape, sound effects, voice-over
  • Show essentials, including drill, color guard and band choreography, costumes, flag, front screen panel and prop design
  • Consultations on client’s current shows

With a wide variety of services and products, the client needed a website which would help customers find and purchase what they need easily. It was also a challenge to introduce such a compound list of services and products adhering to a single visual concept. We agreed on our prior goals to be:

  • Come up with a united user-friendly interface which helps customers look through both: digital products and services.
  • Design a series of internal pages from scratch
  • Provide the ability to easily add different types of content, including: composers personal profiles, musical compositions and articles.
  • Propose and integrate a CRM system to speed up sales and collect and store valuable data.

As a result, we developed a complex fully-customized website with a variety of pages and intuitive content management interface.

Key features

Ecommerce: digital products
UI/UX design for all pages and email layout
Content Management intuitive interface
Music Catalog with a fully-customized browsing experience
CRM Integration

UI/UX Design

We completed the main page design based on the client’s sketch and designed several internal pages, including:

  • Services homepage
  • Service details page
  • Composers catalog
  • Compositions collections page
  • Music catalog with fully-customized browse features
  • Composition details page
  • Blog homepage and detailed article layout
  • About us and Contact us pages
  • Customers services pages: FAQs, Privacy policy, Terms of service, 404 error
  • Ecommerce service pages: Checkout, Confirmation and email layout

Each page has an adaptive design which guarantees an accurate look on any device: desktops, tablets or mobiles based on iOS and Android.

For each page we tried to pre-think our client and customers needs to provide the necessary foundation for further updates and growth. Thus, for a Blog homepage we suggested a search bar and several filtration features to provide better access and more valuable data collection on how people interact with a blog:

Web Development: customization and optimization

To bring up the project for a shorter period of time, we stuck to parallel development principles. Instead of waiting for the whole design to be ready, our developers started to work with pages one by one. This allowed us to complete the project in a shorter amount of time, despite the complexity of using various data.

As a result we created a fully-customized website based on WordPress. The layout is created for this special project and works with custom structure and specific data types. Despite its complicity, the website has a high page loading and data processing speed. Thereby, the website is optimized for the customer and clients needs and is ready to serve modern User Experience and search engines requirements.
The most challenging feature of the project is a Music Catalog, on which we’d like to give more details.

Special feature: Music Catalog

Music Catalog is the heart of the Marching Monk website. Focusing on providing customers with highly-valuable digital products, this part of the website is designed with a deep understanding of both: User Experience and data processing.

For a Content Manager:

  • Intuitive interface for adding digital products
  • Collections creating feature
  • The ability to pick between two composition presence mechanics: to buy immediately from the website or request availability

For a Customer:

  • Unique Filtration Categories
  • Songs playback
  • Additional materials linking
  • Digital products purchasing

Here is an example of interactions with the catalog:

Ecommerce Integrations

To manage sales processes effectively, we integrated Hubspot CRM. It helps store all customers' data in a convenient and secure way. Within one admin panel our client can manage sales stages, tag customers, set email campaigns and have a better understanding of a funnel.

For e-commerce features we integrated Easy Digital Downloads for WordPress plugin. This is an advanced solution developed for digital products commerce special needs. EDD plugin provides the website with all necessary tools as an all-in-one solution with no need for any additional integrations such as payment services.

Conclusion

We created a fully-customized website which reflects the whole range of our client needs. It successfully combines various types of products and services, presenting it pleasantly. The website is easy to navigate for the customers and has convenient Content Management and CRM features. It works with several data types and brings one of the most high-quality experiences in the Marching Bands services field.

Team

Project Manager
Art Director
UI/UX Designer
Full-Stack Developer
Quality Assurance Specialist

Hire Us
Let’s start working on your project
inCode Ltd.
London, United Kingdom
Palliser House Second Floor,
Palliser Road, London, England, W14 9EB
Want to get answers faster?
Fill out our short form brief and we will contact you soon
Services you are interested in
Budget in USD
Contact