My Yummygum (CRM webapp)

From the very start of Yummygum we’ve been using our own Customer Relationship Management webapp (CRM) to communicate with our clients. Because the UI and UX of this first version was far from perfect we wanted to look at the CRM with a critical eye. The result is My.Yummygum.

Top Navigation Bar

In the revamped CRM the foundation of all actions can be found in the top bar. It holds buttons to different sections of the CRM represented by all tailor-made icons. New messages, designs, clients and invoices are added by clicking the + New button.

Sidebar as secondary navigation

On the left of the CRM there's a sidebar showing activity in chronological order. If you log in you land on the Dashboard in which the sidebar would show all types of activity. E.g. (new) messages, invoices, clients and so on. When you would go to the messages page it would only show you the latest messages.

A user's attention is drawn by a blue triangle with icons on the right side of a row. For example; an invoice that's due shows a blue corner with a tiny piggybank icon.

To guide the user only to those elements that are important, we used soft monochromatic colored icons for the normal state of a row. Hovering a row shows much more contrast both in text and icons.

Custom made mini icons

For the sidebar navigation we designed cute 18px icons matching the larger icons in the top bar. We also designed some extra icons for notifications, settings and warnings.

Type new user name here

••••••••••

info@yummygum.nl

Leon

Ephraim

332 Dutchstreet

1037JK         Amsterdam

Modal windows

To add either clients, files, messages, designs or invoices you see a modal window open up giving you all the necessary fields for the item you choose to add. We chose to keep these modal windows visually as lightweight as possible. That comes to show in the minimal amount of contrast applied to the input fields and the background.

A sleek action button at the bottom right of each modal window would allow users to confirm the action of adding the item.

Single Invoice Page

When an invoice gets added, a client receives a notification email with a download link for that specific invoice. They would also be able to view and download the invoice in our CRM.