KOMPOT CRM
​KOMPOT is a Customer Relationship Management platform for small businesses to help manage and support the bookkeeping cycle. 30 student engineers were working on the software while I was working on research, conception and creation with some help from the Product Manager and the Tech Lead. I participated in daily meetings with the student engineers and got to know a lot of valuable insights into creating a wireframe suited for engineers of beginner to medium levels and got to know the tools they use to code, which made my design more engineer friendly and efficient in functionality. My designs were used by all engineers and I was responsible for the communication together with the Tech Lead and the Product Manager.
​
When finished, the software would be used by the PASV school as the first client.
GOAL
Build a demo wireframe of a bookkeeping CRM for PASV in Figma.
LANDING PAGE
Landing Page consists of the top navigation for new users. There is a headline, supporting paragraph, CTA button and a Hero Shot that is followed by more information about the software.

SIGN IN AND SIGN UP
The goal was to make a most clean and simple design.


ONBOARDING WIZARD
This simple wizard was designed to create the most simple and intuitive onboarding. It consists of only the most important information to get the user signed in and using the platform as effortlessly as possible. It asked for an email verification, Company Name, Phone Number, Email and voila! You're in.


CREATING AND EDITING COMPANY ACCOUNT
Once you have created your account and already using the software, the user gets to fill out more details about the company, profile, addresses and this is also where settings would be placed, such as changing one's password.

VIEW OF ALL CLIENTS
Once details are filled out, the user, a small business owner, may add, edit and view all its clients in this simple window. The main navigation bar consists of tabs important for bookkeeping, such as Estimates, Orders, Invoices, Payments, Main Schedule, Admin, Addresses, Products, Vendors and Purchase Orders.


CLIENT DETAILS
To see more details about each Client, the second vertical menu appears on the left once a Client is chosen. All tabs are shown with max 10 recent lists, to give the user an instant overview of the most recent activity with the Client.
​
These sections include Client Details, Addresses, Orders, Estimates, Invoices, Payments, Schedule, Recent Messages Thread and Recent Calls.
​
Form this window, the user may edit, delete or add a new item, such as a new Order, Invoice or Payment. The user may also expand to see the full view of any item or section.
.png)

For smaller screens, the left vertical menu may collapse to provide more room for details.

CLIENT VIEW WITH EMPTY FIELDS
In order to guide the user with the first flow of creating an order, the Estimates, Invoices and Payments are grayed out and disabled, since the client has to make the Order first, before creating an Estimate, which then leads to the creation of an Invoice and proceeding with receiving payment. This flow has been carefully crafted and integrated into the mock up as well as the backend by the developers. Each Order has a number ID that is assigned and makes it easier to keep track of all the records and activity.

CLIENT EDIT FORM
This is a pop-up where the user may Edit the information of any given client and save it.

SUPPORT PAGE
On this page, the user may submit a technical problem to the engineering team by selecting pre chosen categories, a description of the problem as well as an attachment and reCAPTCHA for security purposes.

These are all the categories listed for implementation.
