Wix Chat

With Wix Chat, anyone visiting your site can instantly send you a message and start a chat. Chat back anytime – even from your phone.

[unex_ce_button id="content_a2hcnfxwl" button_text_color="#ffffff" button_font="semibold" button_font_size="15px" button_width="auto" button_alignment="center" button_text_spacing="2px" button_bg_color="#8224e3" button_padding="15px 30px 15px 30px" button_border_width="0px" button_border_color="" button_border_radius="100px" button_text_hover_color="#ffffff" button_text_spacing_hover="2px" button_bg_hover_color="" button_border_hover_color="#000000" button_link="https://www.dropbox.com/s/h60jc6qflekjp68/Process-Sebastian-Mantel.pdf?dl=0" button_link_type="url" button_link_target="_blank" has_container="1" in_column=""]Download Design Process[/ce_button]
Group 6@2xGroup 6@2x

01.

The Challenge

Take Wix CRM to the next level. Propose a new set of tools that allow users to manage their business easily and efficiently. Use Inbox as the primary tool for the new applications.

02.

My Role

The following case study summarizes the processes and methodologies that I used for the creation and development of Wix Inbox, a tool that will allow Wix users to manage their business from one place and be in contact with their customers.

As the Lead Product Designer of this project, I worked closely with a Product Manager, Developers, BI's, UX writers and the marketing team.

The Process

The following steps show the design process I did for the creation of the new Wix Chat for Desktop & Mobile

flowflow

 

High Fidelity Wireframes

On this phase, I focused on space allocation and prioritization of content, the different functionalities, and intended behaviors. At this point, I tried to determine the information hierarchy of the design while making it easier to plan out the content and user experience.

The following wireframes show the structure and hierarchy of the following Inbox’s sections: conversations, entries to the contact panel and configurations.

wireswires

 

User Interface Design

The goal of user interface design is to provide the user with an interaction as simple and efficient as possible so he/she can accomplish his/her goals. User interface design requires a good understanding of user needs, so based on the collected data gathered from previous steps I created the following screens for Inbox Desktop and Mobile.

uiui

Live Visitors 

User’s can see who’s in their site in real time and start a conversation with them. When your status is set to Online, visitors can chat with you directly from your site. When your status is set to Offline, you can use a Lead Capture form to collect visitor information and get back to them as soon as you can.

Smart Keyboards

Once you have added Wix Stores or Wix Bookings to your site, you can create coupons directly from Wix Inbox and send them to your chat visitors..

Mobile

Just as with setting your status, you can chat to visitors from Wix Inbox in your site's dashboard or from the Wix Mobile app on your phone. You can decide which is most convenient for you.

mobile2mobile2

Numbers Overview

Since December 2018

[unex_ce_button id="content_qs95huuf8" button_text_color="#ffffff" button_font="semibold" button_font_size="15px" button_width="auto" button_alignment="center" button_text_spacing="2px" button_bg_color="#8224e3" button_padding="15px 30px 15px 30px" button_border_width="0px" button_border_color="" button_border_radius="100px" button_text_hover_color="#ffffff" button_text_spacing_hover="2px" button_bg_hover_color="" button_border_hover_color="#000000" button_link="https://www.dropbox.com/s/h60jc6qflekjp68/Process-Sebastian-Mantel.pdf?dl=0" button_link_type="url" button_link_target="_blank" has_container="1" in_column=""]Download Design Process[/ce_button]