Shaw Home Redesign
With all this in mind, I have created the following -
HOME
https://marvelapp.com/2e1ad3f (desktop HD)
https://marvelapp.com/5832707 (tablet)
https://marvelapp.com/1g11043 (mobile - seriously, open this on mobile ;D)
The main aesthetics and visuals are inspired by -
Stripe https://stripe.com
Mixpanel https://mixpanel.com/
They correspond to the modern styles used in 2017, with bright eye catching colors, smooth curves, typographic harmony (using limited variation in font sizes and types)
While some of the interaction cues and UX is thought out after looking at -
Khan Academy - https://www.khanacademy.org
Udacity - www.udacity.com
Khan's course arrangement and menus are really well organised. While Udacity's nanodegree pages are perfect examples of good product pages
During my design, I focused on two main things in THE FOLD -
- All course icons - so that user instantly can see what all we have to offer. instead of scrolling down, they can instantly start exploring the courses.
- SEARCH bar - this is really important because, looking at current user behavior patterns, our thinking and interactions are moulded around search. We google up every product or information we seek. it is one of the primary actions on smartphones and desktops both. Providing this right upfront will be a great way to allow the users to find what they are looking for
Other aspects of the page design -
- The main CTA is of a Orange to Pink gradient giving it an attention grabbing look while being more subtle and easy on the eye as compared to pure red. The shadows and hover states bring even more attention to it, giving it a sort of a three-dimensional look yet not being skeuomorphic.
- The USPs are designed with colored icons to look more appealing as earlier they could have been easily ignored and were just adding noise to the page design
- The two main subscription plans are the main highlights here, listing out the points clearly and also use the primary CTA color for the Premium plan since that is our main focus
- The enterprise offering fold goes along much better with the rest of the page aesthetics yet stands out on itself as well
This work is design research based, not user-testing based. We can do testing if we implement this design.
Other Pages are still work in progress, and require a lot more analysis and research (and testing later on)
BROWSE PAGE
Mobile - https://marvelapp.com/2805c7c
PRODUCT
LOGIN SCREEN
https://www.youtube.com/watch?v=jYbgDUNhrl4 (Video Prototype)
If we build this design, we can start testing out interactions, usability and A|B test various aspects like CTA colors, copy etc. one by one and improve them, using the data from Google Analytics as well.
Research reference -
