Case Study UI/UX CRM For E-Commerce

CRM

Translate product strategy into a frictionless e-commerce experience.  My responsibility was to design the UI/UX for the customer and seller app.

CLIENT: Roket

ROLE: USER EXPERIENCE & INTERFACE

Timeframe 2 weeks

User Interface Design

My role: UX & UI Designer

Empathize

We have started the process with casual interviews to build empathy with users. The questions we asked were more on web-based leave management app. For example, we asked questions related to:

  • Statistical data,
  • Applying leave,
  • leave status,
  • Work environment,
  • App-based benefits.

After the user interview, we understood what user do and what they say are completely different. The right way is to observe and ask what goals they are trying to achieve and how they are going to do this. For this, we relied on contextual inquiry which is another qualitative research technique.

Google Analytics and CRM Data Analysis

Based on qualitative research, we have created a great mental model. Based on all insights gathered in the discovery phase, we have defined the essential user flows and patterns, which let us move to the next stages with the least possible risk.

Challenges

Pain Point 1: Login process of apps/tools are not simplified

Support team employee uses many tools and other in-house web apps which requires email id and password with the alphanumeric combinations.

Pain Point 2: Difficult to fetch the Statistical data

Statistical data are not transparent. The user needs to send mail to the manager to get those data and this process takes more time to the user or the user need to maintain the leave records on his own which seems to difficult and lead to human error.

Pain Point 3: Following up the leave request is complex.

Since all the leave related conversation happens through the mail it is complex to follow the leave request mail loop.

Alternative followed: Specific mail subject is maintained by the users to follow their leave request.

 

Pain Point 4: Extra Shift handling reminder

There is no proper automated system to remind about the extra shifts.

Alternative followed: User set the reminder on their mobile phone or use sticky notes on their work desk.

Pain Point 5: Data entry is a tedious process

A manager has to maintain the statistical leave data, extra shift data, extra shift data etc., for all 20 employees in a spreadsheet and need to share those data with the respective employee.

Alternative followed: Manually entering those data, maintaining and share those in the mail, based on the employee’s request.

  • A better understanding of supply and demand;
  • Lack of Communication
  • Better customer service;
  • Lack of Organization Wide Use
  • Lack of Technology Integration
  • A decrease in loss and costs (due to the ability to better record customer sales)
  • Plan out Integration Needs in Advance
  • Pricing and shipping
  • Return and refund policies
  • Privacy and Ethical Issues in CRM.
  • Low Employee Engagement.
  • Reduced manual processes
  • Activity tracking and management

Navigation is done through a side-menu

 

Sidebar Menu

  • Navigation and findability are central aspects of user experience design. With this in mind, navigation becomes a crucial part of user experience and usability since it requires little effort. we established  a number of important guidelines and requirements within which we could also exercise creativity 

    • Layout 
    • Performance. 
    • Accessibility.  
    • Interaction and usability
    • Uninterrupted business. 

Ideation

  • Navigation and findability are central aspects of user experience design. With this in mind, navigation becomes a crucial part of user experience and usability since it requires little effort. we established  a number of important guidelines and requirements within which we could also exercise creativity 

    • Layout 
    • Performance. 
    • Accessibility.  
    • Interaction and usability
    • Uninterrupted business. 

Style Guide

As a team, we designed various symbols that were reused throughout the site, such as typography, colors, and buttons. I converted these symbols into components, and combined various components into the cards seen around the prototype. Typography We kept with the existing typography.

Creating Wireframes With Figma

Wireframe

 

After getting some some research and analyzing my idea was became more clearer about what i want to do.  Then I proceed to the wireframe process. In this wireframe, I present the Information architecture based on the actual content of them and also the layout I propose to present the content so that they know how the page will look. In this process, I think the wireframe process is very important so that I and the client can focus on the content first. Before I go directly to the Visual Design section.

As a team, we designed various symbols that were reused throughout the site, such as typography, colors, and buttons. I converted these symbols into components, and combined various components into the cards seen around the prototype. Typography We kept with the existing typography.

For access essential business information

Dashboard

See your orders in-view

With the integrated dashboard in Ready Cloud ecommerce CRM software.

Gain insights from across all your channels, updated in real-time, and complete with order timeline, shipping and returns reports, seasonality, dashboard breadcrumbs and more. Use this data to fine-tune relationships and to craft stronger marketing messages that resonate with your shoppers.

products, solutions

 

 

Products- Order – Customers

See your orders in-view with the integrated dashboard in ReadyCloud ecommerce CRM software. Gain insights from across all your channels, updated in real-time, and complete with order timeline, shipping and returns reports, seasonality, dashboard breadcrumbs and more. Use this data to fine-tune relationships and to craft stronger marketing messages that resonate with your shoppers.

E-Commerce

A central office calendar

Calendar

 
Products- Order – Customers
  • Calendar with great visibility and unlimited for all important resources.
  • Calendars for Work
  • Schedule any type of work or activity.
  • Plan and track work, jobs, services,
  • Installations, surveys, projects and many others, as you can create your own groups and categories the way you need.
  • Calendars for Time
  • keep track of all the appointments
  • Plan blocks of time from minutes to years and include the employees, assets and tags they need.
  • Each employee has their own color, and when your team is available for a meeting you can adjust any appointment if you have the rights to do so.

mailbox” option under shared mailboxes

Mailbox

 
User can compose an email with a few clicks and send it to specific  group of customers. They can compose this group based on the customer information. In this way they are able to send a specific message to a specific group.

Enjoy unlimited management solution

Email UI Design 

User can Pick an email layout that works for them There’re several templates and layouts to choose from. There are three common ways of showcasing the content in email design: Inbox Details  email design It can be divided from personal, work, friends, family and social.

  • Inbox Details  email design It can be divided from personal, work, friends, family and social.
  • There is a variety of colors
  • There is choice of fonts
  • We can change the layout of the mailbox.such as:
  • Inverted pyramid 
  • Single section
  • Zigzag 

Easily accessible customer service

Live Chat

This means that our sales team can share important conversations and have them all at our fingertips when we’re communicating with our leads and customers. There are many cases when an access to a history of conversations is useful. For example when your agents need to verify a previous chat transcript to research purchase history. Or when a customer claims that he had a discount granted by another agent and they need to verify it. Everything is in place, and they don’t have to search the conversation history in the archive. sales team can share important conversations With features like real-time messaging, video chat, task management, Also they can add announcements, and instant language  remind the others of pending conversations with customers,or internally  Plus, they won’t miss any important chat messages, 

Task Management

Task

setting a task for Individuals or assigning to different team members or colleagues across the organization, or remanding the employee about their daily activities. Easily set reminders for tasks synchronized with calendar to never miss a deadline and have a proactive approach.
  • Create tasks for appointments, meetings, phone calls, submission deadlines and more. See who’s doing what and share tasks.
  • Create tasks and subtasks
  • Receive task reminder emails at the start of each day
  • Add custom task categories
  • Create repeating tasks

Planning, tracking, and delivering

Project Management

To manage the task we need to split our time between meetings, managing people, acquiring resources, deadlines, etc. 

But in project management, we can:

  • Allow sales and account managers to see where a project is in the process
  • Create strategic alignment between PM teams, sales, and customer service
  • Product planning and strategy
  • Event management
  • Inventory management
  • Business process management
  • Project tracking 
  • Product roadmapping
  • Cross-team collaboration
  • See customer activities while working on a project
  • Maintain contact management all in one place
  • Create tasks, provide notes, etc.
  • Execute projects as soon as sales occur
  • Tracking lead/customer behavior
  • Competitor tracking
  • Creating customer profiles/personas

Enjoy unlimited management solution

Manager File

File Manager can be used to store and serve files.

All files uploaded to the File Manager are publicly accessible, may be indexed in search engines, and are served over our global content delivery network. The File Manager should be used for files that are intended to be utilized in file pickers.

Manager file can be personalized and be divided in different section. The administrative console usually includes functions for establishing, deleting and managing customer accounts.

On most consumer sites, all customers are treated the same. However, many business-to-business sites provide more advanced functions such as discounted pricing for groups of customers (for example, dealers or large accounts), negotiated contract based pricing for specific accounts, or a product access list for selected business customers. For manufacturers selling to wholesalers or dealers, even basic site access may require a log-in, which is only available to pre-approved, qualified users.

Manage files by:
  • Search for files based on the type or other criteria to get information in no time.
  • Choose between personal and public files.
  • Add and manage files for members of your organization to review.
  • Manage, delete or edit the files as per your requirements any time provided you have the access to do the same.
  • Access files from any location through an app on iOS, Android device or web browser.
  • If you have sensitive information in the document attached, you can restrict its access among the users who can view the document.

Enjoy unlimited management solution

 

Notes

User can make adding notes mandatory at every stage of their sales process. In this way, new actions can only be performed on a record when notes are created. What user can do is:

  • Tasks for appointments,
  • Meetings, phone calls,
  • Submission deadlines and more.
  • See who’s doing what
  • Share tasks.
  • Receive task reminder emails at the start of each day
  • Add their own custom
  • Task categories
  • Create repeating tasks

Enjoy unlimited management solution

Contacts

Contact management is the act of storing, organizing, and tracking information about user’s contact. In its most basic form, you can manage your contact data using an address book or an Excel or Google spreadsheet with entries for all the people you do business with. What user can do is:
  • Access to data in real time from anywhere
  • Integration of customer information from other sources
  • Integration of social information
  • Smart collaboration with colleagues
Envelope Phone-volume Linkedin-in Pinterest Behance