Next Project

Savio Dantas - UX, UI and Interaction Designer

To design is to communicate clearly by whatever means you can control or master.

- Milton Glaser -

Case study Website design & Branding - TeachAnyTime, NYC

Website Revamp & Branding

TeachAnyTime.com is a platform or marketplace for online learning. TeachAnyTime provides a platform for experts of any kind of subject to create courses which can be offered to the students, either at no charge or for a tuition fee. The students can follow their progress with their teachers and also give ratings on courseware provided. I enjoyed the challenge of re-designing the website and create TAT brand as a UI/UX designer.

TeachAnyTime Screen
TeachAnyTime logo options
TeachAnyTime final logo
TeachAnyTime final logo
TeachAnyTime color theme

Designing the brand (Color & Font)

Website and logo color theme was initially suggested by the client as GREEN & BLUE, but eventually it was changed to more subtle color format. Logo and website text font used is OpenSans, designed by Steve Matteson, Type Director of Ascender Corp. It’s free and open source and can be optimized for print, web, and mobile interfaces.

TeachAnyTime IA
TeachAnyTime wireframe

Information Architecture and Website wireframe

I worked with the client to figure out the website structure and content. The IA was purposely kept small and shallow to ensure that the website could be quickly and easily navigated. I sketched out some initial concepts and wireframes and discussed them with the client to ensure that we were both on the same page.

The main aim of the website was to create a platform or marketplace for online learning. It should provide a platform for experts of any kind of subject to create courses which can be offered to the students, either at no charge or for a tuition fee. The students can follow their progress with their teachers and also give ratings on courseware provided. Once the client was happy with the initial wireframe for home and inner page, I moved into Photoshop to put some concepts together based on the brand and initial sketches. The homepage design below was the final output of all the hard-work and final discussions on the wireframes.

Mobile UX Checklist for TeachAnyTime

The web portal was made responsive to make it totally device independent using media queries. Below is the checklist which was followed to make it mobile friendly or device independent.

  • Buttons and touch targets are at least 44px by 44px
  • The font size of body copy is at least 14px
  • The line height of paragraph text is at least 1.5
  • All aspects of the site are touch-friendly
  • Information found in hovers can also be found on mobile
  • The website reflows in both portrait and landscape orientations
  • Common touch actions fall within the easiest to reach areas
  • Navigation is optimized for common mobile actions
  • Non-essential menu items have been moved to the footer
  • The context of each page is extremely clear
  • A home screen icon is included on your site
  • Text has been removed from images
  • Vector-based icons are used instead of images
  • Images are high resolution / Retina quality
  • Images are featured prominently on relevant pages
  • Image carousels if any are swipable
  • Buttons are made with CSS rather than images
  • Elements which toggle open do not cover other elements
  • Forms use custom input types
  • Forms are as short as possible
  • Autocorrect and auto-capitalize are disabled on form fields.
  • Device APIs are used where appropriate
  • Calls to action are labelled with descriptive information
  • Calls to action in the conversion path follow a common design scheme
  • The website loads in under three seconds on a 3G connection
TeachAnyTime final mockup

Task accomplished

It took me around a months time to work on this project with such an awesome client to interact with who was always ready to answer any queries related to design and development work for this project. It makes it much easier to achieve your final design once you are clear about the objective and customer base of any project. I had a great time working with this client and I'm glad that I could help them create a brand and website that met their company needs.

Interested in working together?

Email Me

or read my blog