Guitarist and instructor Michael Palmisano had an idea for revolutionizing the world of online guitar learning. Starting from scratch, he needed an experienced design and development agency to bring his idea to life. The Web Development Group helped Michael actualize every detail of Guitargate’s foundation—from its concept to its name and branding.

View This Project

Guitargate responsive design worked on any device

Branding the Startup and Researching the Product

When he hired The Web Development Group, Michael wanted Guitargate to be a video-based, online guitar instruction platform. Learners would follow structured lesson plans, upload their progress, and level up when they proved their mastery.

The brand needed to appeal to a younger, rock-focused base, while at the same time, maintain the respect of guitar experts. We created a mark, using a guitar pick for inspiration that achieved exactly what we set out to do. With this initial step, Guitargate was born.

Initially, our strategists researched and analyzed different competitors to make sure Guitargate would surpass the existing standards of online learning. Through competitor audits and by studying the learning habits of guitar players, our user experience team determined that the user’s device should not be a hinderance to the overall experience. As our strategists focused on making the product intuitive to use, our design team worked on a logo concept for Guitargate. After many iterations, our final design direction displayed a guitar pick elegantly shaped into the letter G.

Guitargate logo and branding
Sketch of logo and branding for Guitargate

Constructing an App-Like Interface on Drupal

Usability was at the forefront of our design concepts, allowing guitar learners to use their preference of mobile, tablet or desktop. All elements of Guitargate’s design were optimized to best accommodate the particular person who was learning the guitar. Given the app-like experience of Guitargate and how the content was organized, we recommended implementing a Drupal CMS for maximum flexibility.

On the administrator’s side, Michael needed to be able to enter lessons, organize progression levels, and expand his lessons to other instruments in the future effortlessly. Drupal allowed us to build out user permissions for lesson progression and incorporate payment integrations.

Mobile wireframes for Guitargate

A Secure, Members-Only Environment

Guitargate is a highly interactive, members-only community. Learners watch one-on-one videos for a private lesson experience, then engage directly with Michael and his team in the discussion section. Beyond that, learners can engage with their peers by viewing videos from other users showing off their talents on each lesson.

The video lessons were uploaded onto Guitargate by integrating them through a secure Vimeo account that is not accessible to public audiences. We leveraged YouTube to make it easier for users to upload their videos and pull them directly onto Guitargate. The ratings and comments features work just like YouTube, but are only viewable to the Guitargate community.

Guitargate video samples
User Interface design comp for Guitargate lesson page

Payment Integration with Recurly

It was very important for Guitargate to have an easy process to sign up, so we built a system that allowed users a free trial period without needing to enter any payment information. Once a learner falls in love with Guitargate, collecting payment information is simple.

With a third party service, Recurly, we established a payment integration within Guitargate, allowing users to enter their payment information once for a recurring payment monthly or yearly. All transaction data—card information, user name, user addresses—were passed securely to Recurly, so we did not have to store any sensitive user information on the site while still linking this payment information to each user.

Start a Project

Let WDG Help You
Grow Your Business!

Let's Talk