top of page
T.D Finance
Business website
Web/Mobile
Overview
T.D.Finance is a Tel-Aviv-based financial services company that provides multiple financial services to individuals and businesses who wish to raise their credit rating and make it positive.
The company uses a website to provide customers with information on financial issues and enables direct communication with the company's representatives via phone, msg, mail and personal login area.
about the project
Money, Money, Money must be funny
When Daniel Kharmatz and Tom Dahan reached out to me, I knew this project would be: new, challenging, and, of course, fun. Daniel is a good-old friend and both are great finance consultants. I'm in !So we start working on this project and the initial pitch was simple and clear - let's creat a new face and a clear identity for our company, starting with a new logo and all the way with a brand new website.
Our collaboration was just like i imagened, they knew exctally how to explain what their company is all about and what services they provid. They were there throughout the enthir project, answer any questions I have, and let's just say I drove them crazy (LOL) but at the end we got the results we were looking for. I've learned a lot, experienced a lot, failed some, and had the best product design thinking with Maya (the loving programmer).
ROLE
Visual design (web, mobile)
Prototyping & Testing
Interaction
Logo design & re-branding
CLIENTS
Tom Dahan
Daniel Kharmatz
Date
November 23' - Febeuary 23'
Visual Identity
We did a lot of preliminary work before launching a new website. We had to understand and make the right decisions about the new logo and the new design identity of the brand. There was no doubt that the previous choices of the business needed a refresh. The logo was outdated, the colors didn't work with the new direction & idea of the brand and there was a lot of information and therefor a lot of visual overload.
The company gave me kind off "do your own magic" with the new logo and the new color palette. The direction was: very clean, calm and modern meets/gives a certain sense of security/confidence. They said they want there names in the logo but in a "hidden" way, so we decided to go for initials. and after a week we had it all figered out. For the site itself we chose also to go for a very clean and clear typography. Something that will work great with the logo and the company services.
Typography
Colors
Secondery
Primely
Visual Design
The main visual challenges
After several conversations aimed at a precise understanding of the business - we decided that there are two main goals -
To show customers only necessary, targeted and purposeful information. They should get answers to questions. Answers that will satisfy them enough to make contact and leave details. In the end, the company invites people to a face-to-face meetings and the main goal is to schedule as many meetings as possible.
One pager -
explain to the clients the need for one pager over an entire website (at least for now)
Visual overluod -
organze information properly
ONLY necessary information
"All roads lead to Rome" -
CTA buttons that direct customers and get them to leave details & contact
One pager
The smartest decision for this type of site is - one pager.
A One Pager is a Single Page website with no additional pages like About, Team or Services. All the content sits within the same webpage, traditionally in a long-scrolling layout. See the beauty of a One Page website is it tries to promote one thing in an uncluttered, direct manner.
This gives the company the option to present its services and tell about itself but not yet reveal everything. The rest as we said, as part of the main goals of the site, is to get people to leave details and come for a meeting.
.png)
Visual overluod
.png)
Visual overload is basically an incorrect arrangement of information - and a lot of it.
This is also one of the main reasons why customers leave a website/app and try to find and choose competitors. Let's take ourselves as an example. If we're looking for an answer to a certain question on the Internet, we want an answer as focused as possible that will provide us with the relevant knowledge on that specific topic. Imagine a situation where you were looking for a certain recipe and the website you searched for told you how to make the flour itself. Unnecessary and irrelevant for you. You just want to know how to make the bread (LOL)
In businesses that have a lot of information for customers, you need to know and think carefully about two things:The 'What' and the 'How'
- What available information is critical and most important for customers.
- How to arrange the information properly for web/mobile.
In this part of the project my role was to work with the clients on "reducing the information". Only what is relevant enters the site, what is less relevant or not important enough will receive a face-to-face response if required.
After my clients focused the information, we checked the areas on the site which we would have to find a smart solution for arranging the information, there where three:
1. Services - a detailed explanation of all the services the company has to offer
2. Questions & Answers - frequently asked questions and answers
3. Articles and additional info - articles relevant to financial issues and topics in which the company specializes
Services (visual overloud)
It was important for the company to present its customers with all the services it has to offer. Each presentation of a particular service should include: a description
of the service, the time period to complete the process and pricing.
The goal was to give customers information openly and allow a full understanding of the services. The services themselves are clearly laid out on both sides of the screen with the selected information/service appearing centered in the middle.
You can see that we did not load a lot of text and information on the screen. Only what is relevant for each individual customer will appear on the screen according to their choice.
Pricing
Description
Time
Services
Questions and answers (visual overloud)
Another part of the site that we had to deal with is the FQA (Frequently questions & answers). This is an important part found in many sites of this type and others. It allows the customer to receive preliminary information before a certain process begins.
I asked the clients to gather some questions and focus them on the most critical and important ones for their customers. There were 11 questions and answers.
If we were openly display both the answers and the questions, we would end up with visual overload, so the best way to solve this problem was for the questions to be in one place in such a way that would allow the customer to quickly search for what he wants. When a customer wants to get the answer, he simply clicks on the question and the specific answer opens before his eyes. When one answer is opened, it appears under the question and hides the other questions so that the eye is focused exactly on the text that appears.
Several questions can be opened at the same time. When a question is opened followed by another question, the answer to the previous question is not closed. This is because the questions and answers are related and can clarify a bigger picture for customers.
The questions themselves are also arranged in an order that suits customers to ask. Before arranging the questions in their place, I sat with the customers and tried to understand the way a customer behaves and what he can ask When he is interested in receiving a service
Articles and additional info (visual overloud)
Another part that was important to the company is to allow customers to view articles related to the topic and the services they offer. The articles may be relevant to new clients or clients who are already in the process and want to stay updated and understand more about the subject.
In order for this part of the website to not be overloaded with lots of articles and text, we decided that 3-5 articles will appear at any moment (company's choice ) when they change every week. The old replaces the new.
In this section we have also included a smart option that will allow customers to continue to stay on the site and receive the information through it. We added a search bar. The search bar will allow customers to search for exactly the articles that are relevant to them beyond the articles that appear on the screen. This tool aims to give convenience and more "power" to customers.
The purpose of the search bar is to expose the customers to the entire database of articles published by the company in the past by subject.
"All roads lead to Rome"
One of the main goals of the site, as we mentioned earlier, is to get customers to make an appointment and get financial advice. From there the company makes money. Because this is one of the important things for the company, the goal is that the ability to contact it will appear in a smart way during
the scrolling on the site and in addition will
appear in a clear and highlighted way. We call it
CTA buttons (call to action).
We basically emphasize something to creat interest in the customers eyes and from there leading them to clicking a certain button in our case.
I chose the yellow color which also blends well with the brand's color palette. I made it accessible by buttons in as many correct places as possible and of course each click on one of the buttons leads us to fill out the form ('contact us') and leave details.
**You can see the yellow buttons marked in red
.png)
'contact us' form
The 'contact us' form itself is built from a certain division. On one side, client side, you can leave details for future return. When filling out the form, you can specify in free text box the reason for the request and thus direct the company exactly to the reason for the request. (you can see it on the right)
The form includes dry, relative details that are accepted in many forms such as full name, email, and phone.
The second part of the form, company side, has the details of the company. Location, contact phone number, address, business hours and email. You can also find the social networks used by the company. At the end of this form, there is also a large yellow button(CTA) whose purpose is to send the details you filled in and move forward a step toward scheduling an appointment and establishing direct contact with the company.
Prototyping
Let’s make things move to help the concept
Being able to prototype is a huge benefit for my clients because it gives me new tools and ways to empower my creativity.
Giving customers the ability to experience the product and design as close to reality as possible. At this point, they can also stop one more time and fix any final details they want to have on the site.
View the next project
bottom of page