The project is about the re-design of HiKitchen’s site and the realization of a technical analysis of the problems encountered by the client, with the aim of providing practical solutions in the field of SEO and also UI/UX.
2. WhaleLab - Website Restyling proposal for HI KITCHEN – 30.10.2015
MISSION
The project is about the re-design of HiKitchen’s site and the realization of a
technical analysis of the problems encountered by the client, with the aim of
providing practical solutions in the field of SEO and also UI/UX.
ENJOY
3. WhaleLab - Website Restyling proposal for HI KITCHEN – 30.10.2015 3
MISSION
WORKFLOW
• Technical and structural analysis of the site;
• Research phase;
• Proposal of solutions and strategies to be applied;
• Graphic and structural restyling;
5. WhaleLab - Website Restyling proposal for HI KITCHEN – 30.10.2015 5
ANALISI E STRATEGIA SEO
EASYTOFIND
• The domain name is functional for the SEO indexation because it contains
a word of common use;
• Informative query: 40% of the searches made on the web are used to
search for information or learn something.
We can capture this slice of users through the blog section (in use SEO
keywords specific to this area);
6. WhaleLab - Website Restyling proposal for HI KITCHEN – 30.10.2015 6
ANALISI E STRATEGIA SEO
INCREASINGTHEVISIBILITY
• A good organic positioning requires sites that speak of HiKitchen to
increase its link analysis and link popularity;
• A constantly updated site is a more attractive site; the blog section plays a
key role in raising the link frequency;
7. WhaleLab - Website Restyling proposal for HI KITCHEN – 30.10.2015 7
STRATEGIA SOCIAL
TOINVOLVE
• 83% of Italian companies uses Facebook (the sector that uses it the most
is the electronics one, with 100% of the companies that has a Facebook
page), and 64% uses Twitter;
• The presence on social networks needs to have a goal: customer care and
targetted advertising;
• Direct contact with the customer is essential;
• Carefully monitor user activity. It is not enough to open an account but
you must animate it and stimulate the engagement of users without falling
into spam;
• Users aren’t only potential customers and conversations on social
networks should not be aimed only to buy but to strengthen the direct
relationship with the brand by providing information, curiosity and services.
Repropose on social networks articles published in the blog;
9. WhaleLab - Website Restyling proposal for HI KITCHEN – 30.10.2015 9
PIANO DI AZIONE
EMAILMARKETING
• Today email mail marketing brings great benefits to us, especially to
publicize the introduction of new products and/or new offers;
• Subscription to the newsletter allows us to profile the users (several lists
divided by sector);
• Through profiling you can send newsletters with products suggestion
according to users’ preferences;
• For email marketing to be effective you need to monitor the redempion:
- received and discarded;
- received, read but not performed;
- Received, read and performed;
10. WhaleLab - Website Restyling proposal for HI KITCHEN – 30.10.2015 10
PIANO DI AZIONE
IMBOUNDMARKETING
• Using the inbound marketing: build a relationship between the company and
potential customers by luring them with valuable content and interacting with
them on social networks, so that is the user to look for the company;
11. WhaleLab - Website Restyling proposal for HI KITCHEN – 30.10.2015 11
PIANO DI AZIONE
TIPS
• For the success of a promotion campaign you must catch the attention at the
beginning, keep it alive with graphics and concise texts;
• The inclusion of video raises the popularity rating (they could be included with
the photos in the product page);
• Minimal graphic - maximum visibility for products;
• Promote both top-line products and new arrivals;
• To encourage purchases you need a good policy of returns and refunds;
• The ability to change orders already executed encourages the user
to buy more easily;
• Having dedicated app on their device encourages users to navigate more often
the site and facilitates the use on mobile devices;
• A good presentation of the product and a simple and direct purchasing
method mean that the user is encouraged to buy and to recommend the
site to others;
13. WhaleLab - Website Restyling proposal for HI KITCHEN – 30.10.2015 13
LAYOUT
14. WhaleLab - Website Restyling proposal for HI KITCHEN – 30.10.2015 14
LAYOUT
SEMPLIFIEDNAVIGATION
• Shop menu and blog menu clearly distinct;
• Always just a click away;
• If you do not need it, hide it;
15. WhaleLab - Website Restyling proposal for HI KITCHEN – 30.10.2015 15
LAYOUT
FOCUSEDRESEARCH
• Immediate selection of the scope of research;
• Ability to refine the search in a targeted manner;
16. WhaleLab - Website Restyling proposal for HI KITCHEN – 30.10.2015 16
LAYOUT
CONSTANTPATTERN
• Site navigation to the left (contextual to the section where you are);
• Services available in that section of the site to the right;
17. WhaleLab - Website Restyling proposal for HI KITCHEN – 30.10.2015 17
LAYOUT
FULLINTERACTION
• A single widget with all the functions you need;
• Click: instant access to your wishlist, cart, comparison section (if you have
selected the products), orders, personal profile;
• Drag & Drop: drag a product from the page to the widgets will activate
the option to add the product to your wishlist, the cart or the comparison
section;
WISHLIST ORDERS
CART SETTINGS
COMPARE
18. WhaleLab - Website Restyling proposal for HI KITCHEN – 30.10.2015 18
LAYOUT
INTERACTIVEWIDGET
• Discreet, handy and repositionable;
• Always ready to use;
• We make simple, intuitive and funny the buying process through the
interactive widget (offer mobile technology on desktop devices to make
easier the cross-platform use of the site);
- Drag the product in the cart;
- Drag the product in the wishlist;
- Drag the product in the comparison area;
19. WhaleLab - Website Restyling proposal for HI KITCHEN – 30.10.2015 19
LAYOUT
COMPAREFIRST
• Ability to compare products before buying:
- Direct comparison using drag & drop on the widget;
- Read the reviews on the blog;
- Open a discussion on the blog to receive feedback;
20. WhaleLab - Website Restyling proposal for HI KITCHEN – 30.10.2015 20
LAYOUT
CUSTOMIZEDPRODUCTS
• In the case of products with different configurations we suggest an
interactive customization system: through hotspots present on the photo
you can see details of the product and choose from different configuration
options (eg: color, type of components etc...);
21. WhaleLab - Website Restyling proposal for HI KITCHEN – 30.10.2015 21
LAYOUT
SELLINGPROCESS
• Add the product to your cart as and when you want: from your wishlist
by clicking the button of the product purchase, or directly from the search
results by dragging the product in the widget;
• Simplify the sales process summarizing it on one page, so that you may
continue to see all the passages until the completion of the purchase;
• A vertical timeline guides the user pointing to what step is he at;
• Ability to change at any time the data already entered;
22. WhaleLab - Website Restyling proposal for HI KITCHEN – 30.10.2015 22
LAYOUT
BLOGAREA
• Tips and recipes that encourage the user to buy products using direct links
to e-commerce;
• Technical comparisons between specific products;
• hypertext links to product data sheets;
• Allow members to open discussions to take recommendations and
opinions on products;
• Promote best sellers and just got through regular articles (you might
create a weekly column);
• Chromatic distinction of the post’s topic;
• Immediate visibility of content and information;
• Slider with the latest topics published;
• Buttons for direct sharing of the articles;
24. WhaleLab - Website Restyling proposal for HI KITCHEN – 30.10.2015 24
GRAFICA
ALTERNATIVENAMING
• To be coherent with the new design of the website, the logo of Hi Kitchen
should be clean, linear, direct and minimal;
• it has been used a naming very simple to even out tone of voice of the
new site;
• This doesn’t want to be a proposal for a logo, but only a guideline for us, of
what a future redesign of the brand could be;
25. WhaleLab - Website Restyling proposal for HI KITCHEN – 30.10.2015 25
GRAFICA
STYLISTICCHOICES
• We chose to characterize the two main sections of the site by the colors:
green for the shop, and red for the blog, so that you may always know in
which part of the site you are;
• The use of the same structure as base, means that the user perceives shop
and blogs as part of the same site;
26. WhaleLab - Website Restyling proposal for HI KITCHEN – 30.10.2015 26
UI KIT
29. WhaleLab - Website Restyling proposal for HI KITCHEN – 30.10.2015 29
PROTOTIPI
DESKTOP VERSION
https://marvelapp.com/77he1i
MOBILE VERSION
https://marvelapp.com/gcei9b
TRYITDIRECTLY
ONYOURSMARTPHONE