Create Your First Project
Start adding your projects to your portfolio. Click on "Manage Projects" to get started
Web: Whisbi Helpcenter
The challenge:
Migrate and refresh the Whisbi Help Center while merging it with the API documentation.
My Role:
As a Design Lead at Whisbi, I was responsable for this project from the the Kickoff of meeting to the website launch.
Primary Goals:
· Speed up Workload Management
· Improve Service Quality
· Boost Customer/Employee Satisfaction
· Contribute to Business Growth
· Refresh look and feel and make it match new style guide
Value:
· Help customers solve their issues step-by-step;
· Guide customers with how-to guides;
· Help customers search and find answers by themselves;
· Support agents while solving technical issues;
· Serve as a knowledge base that contains all relevant product information and updates;
· Provide customer with live help assistance if required
Project Owners:
UI & Web Design: Marta Teixeira
Developer: Jordi A. Sintes from Insideers
__
The Whisbi Help Center is a 2 in 1 web tool designed to provide technical support to employees and customers.
Design Highlights:
· Intuitive navigation: This Vertical and Sticky sidebar menu is simple to use and make it easy to quickly access content at any time. Because the menu only opens when the user wants it allows longer menu copy without compromising the space.
· Live Help Widget: With the presence of our Whisbi Widget, the user is able to request or schedule live help at any time.
· Appealing content: Visual hierarchy guides people through content being presented. The use large fonts with an adequate line-height and a contrasted color have a direct impact on readability.
· Instant search: Instant search is used when you first start typing in the search field. As the user types, article titles that match the search appear.
· Tags and Breadcrumbs: Tags help you organize and categorize the messages in HelpDesk. Breadcrumbs work as a navigational aid that allows users to keep track of their current location on the website.
· Responsive Tables: Will display a horizontal scroll bar if the screen is too small to display the full content
· Code Blocks: With HTML blocks, users can copy unsupported code and easily paste it where needed.
· Highlights and Pro Tips: Are a simple way to make relevant notes stand out. With the help of color coding It becomes easy diferentiate note types.
"Creativity, teamwork, critical spirit and innovation."
Beatriz Silva,
Studied with me at ESAD, Porto