times
carnatic lessions
my role • branding + ux/ui designer
softwares • illustrator, photoshop, invision
project • revamp the existing site for carnatic lessons
date • feb, 2015
problem
the client had an existing website that he used to host video tutorials to teach eastern classical music. the company was called carnatic lessons. primary objective was to create a brand identity to be applied as a digital product
research
for this particular project my research was more about understanding the clients requirements and needs. there was no access to users or objective to design for user needs. after some discussions with the client we came up with the following design deliverables
‍
• logo/brand identity
• homepage
• 4-5 subpages
• login/register portal
• user profile page
• f.a.q page
• membership info page
raman kalyan
• client •
brainstorming
to get the juices flowing i requested the client to share as many references of what he likes and any and all images he might have of him working, i also started pulling together images for inspiration to create a mood board
branding
once i gathered all the building blocks i put together the bones of the logo. my approach was simple and deliberate, from the time i started working on the project i was envisioning a play on mixing indian sanskrit type style with english typefaces. after some digging through dafonts.com i found a typeface that delivered what i was looking for, first i created the monochromatic base of the logotype
fonts used
samarkan | titivillus foundry
avenir next | linotype
brand colors
wireframe
to setup the structure i first created a wireframe for the page. which included navigation, page sections and content organization.
ui strategy
with the user interface i wanted to capture the fluidity that comes with everything related to music. i experimented with some bold layering, texturing and came up with the following style. the idea was to have a parallax effect as the user scrolled the page.

check out the example of one of the page sections
here is sample of the components style sheet that i created for the developers. it consisted of assets, link states, buttons, section backgrounds and section titles
designs
for the final designs i submitted the following pages to the client

• main landing page
• sign in module
• member profile
• contact us
• faqs
• terms of use

check out a few them below
main landing page
member profile
output
even though the development phase was not something i was involved with. for the initial rounds of development i stayed in touch with the client to see how the site was being put together. below is a screen recording of the site in-progress. Still has many bugs but was headed in the right direction.

check it out
next project