CrediWire

Role: UX designer, UI designer, graphic designer Tools: Adobe XD, Illustrator, Photoshop, HTML/CSS As an in-house designer my job tasks range quite widely: from simple graphic design to the actual usability of the product developed (mostly latter). Working on the CrediWire app has actually been an interesting challenge to an interaction designer, as the product (data visualization and sharing tool for finances) has three quite different target groups - business owners, accountants and banks - who all have their own interests and levels of experience when it comes to financial data. What is CrediWire? CrediWire is a tool for visualizing financial data and sharing it among different stakeholders. Besides just connecting to the users' bookkeeping data, the tool also provides an overview of industry standard, direct communication between all the parties involved, reporting system and debt cases among others.

CrediWire Goals

Target Groups

SME's: Making up the most diverse group of the three, the SME user can vary from the owner of a large supply chain to a small plumber. Just as their business background can differ, so can their understanding of finances, from beginner to advanced. An SME user would mostly use CrediWire to have an overview of their financial data (with helpful descriptions from the system), compare how their business is doing in relation to industry and share their data to other stakeholders.

Accountants: The accountants (whether individual or a firm) use CrediWire to have a structured overview of their clients and their data, with the possibility to create simple finance reports, complete with comments and highlights, to be shared by a link via e-mail.

Banks: The bank users operate on a similar level as accountants, but divert their interest more towards financial overview, early warnings and overall ways to consult their business clients.

Key Challenges

Complex financial data: How to display the messiness of raw data in the most understanding and sense-making way? In order to help the user understand what he/she is looking at, CrediWire system explains the user what is actually visualized on the screen. It is also possible to turn on Easy Mode, mostly for SME users not so familiar with financial terms. In addition to that, a Wiki is also being developed.

Usability of a complex system: Another key challenge was (and still is) to polish the overall usability of the app. The tools for the user are quite extensive, what has led to some of the users feeling alienated, especially at first. In order to counter that we have developed grouping systems (certain types of options grouped together, f.x.), guides for first-time users (think: advisor in the start of a computer game) and hints/newsletters when the app could prove useful based on the financial world, among other things.

Catering to three different levels of knowledge: Even though some of the features are only available to certain types of users, the three target groups still operate inside the same app. This leads to different types of personas operating in the same space, with varying levels of knowledge and goals.

CrediWire Interface

The registration process. A new user is asked to create a company profile and choose their bookkeeping provider for CrediWire to start visualizing and analysing data.

An example of the timeline function, where Revenue is activated and then compared with industry standard.

An example of the "timeline" view with Revenue and Contribution Margin activated below.

An example of an accountant having a client connection open (top menu) and in the process of creating a report. Many accountants felt it's important to be able to create a PDF-like report with comments about shown data. UX wise this was a tricky task as the moment the perimeters were changed the system treated it as a new page. However, it was important to go back and edit the already existing page.

The creation of the report from the accountant's side.

The report when accessed as a client.

Overview of the connections page. On this interface the user can connect and check status of all their connections with other companies.

The invoices overview.

The interface for account mapping. The user behavior for mapping requires list items that can be moved not only from left-right but also between categories in its own. That is why it was important that the drag-and-drop and scrolling would work in a smooth and fast way.

An example of an in-app table design.

Promotional Visuals

The constant change of businesses (aimed at construction-oriented SME's)

The constant change of businesses (aimed at IT-oriented SME's)

CrediWire

You may also like