So you have your eCommerce idea, you’ve built a Sitemap, you’ve reviewed what yo
So you have your eCommerce idea, you’ve built a Sitemap, you’ve reviewed what your main competitors are doing, you’ve looked at a ton of websites’ marketing programs and functionality, and you have your mood board in hand. I think you’re now ready to take a stab at designing your Homepage. Not to fret, this is your first draft and you’ll have opportunity to submit a Homepage version 2 in your Final Project. The Homepage is the most critical page of the entire website and contains many elements. Your Homepage design should also follow the aesthetic of your mood board and your sitemap should guide what your links are. Feel free to use the design platform of your choosing. Many like to use Adobe Photoshop, Illustrator and XD, and others have used PowerPoint and other simpler tools. There are also sites out there like Wix that allow you to mock-up for free. I just want to make sure to note that not all the elements I am looking for in this assignment will be available of these free sites.
Get inspiration from noteworthy sites and review your competitors if you’re having a tough time getting started. Look at how your favorite website homepage are structured. Don’t forget all the minor details.
You are allowed to “swipe” ideas from a few websites, but do not simply copy a template and imagery from another brand. You may use imagery from other websites, but I recommend you try using imagery from a variety of resources (free stock imagery, Adobe Spark, etc). Get as creative as you want (the world is your oyster in regards to functionality, widgets, marketing, content, etc), but always stay consistent to your brand image and make sure we know what you are selling and are trying to promote.
Your HP design should have at minimum the following –
Brand Name / LogoI recommend that your brand name/logo is aligned left or centered
NavigationThese are your shoppable categories across the top after your brand name
Search Bar, Login, Favorites, Shopping Cart Iconsalign right corner
Hero Banner(s)*This is the main image underneath your navigation
Additional Content*: Smaller Banners and Tiles w/ Images, Texts, and/or Video linking to category pages, special promotions, blogs, press mentions, etc
Social Media Icons
Email Sign-Up
Footer Menu (About Us, Customer Service, Blogs, Sustainability, Privacy Policy, etc)
Global HeaderThis is the bar across the top of your website that will have the latest news or a promotion
Minimum 1 Promotion Could be in Global Header, in email sign-up, or in one of your banners Example: Free Shipping on Orders over $XX, Buy One Get One offer, Additional 50% off Sale, Loyalty Program incentives, Shop Now, Pay Later, etc
*Note: all banners and images should have a call-to-action (SHOP NOW, LEARN MORE, etc) that potentially goes to another page of your website when you click on it.
Review these reference links to help guide your HP design:
https://sumofy.me/blog/2015/06/30/5-parts-of-a-website-and-their-design-trends-this-2015/
https://11web.com/parts-of-a-website/
https://blog.hubspot.com/marketing/elements-of-modern-web-design-list
https://www.orbitmedia.com/blog/what-to-put-on-your-homepage/