UX/UI design - How to tell a brand's story

“A picture is worth a thousand of words!” and this sentence finds a special weight in the IT community.

As a company specialized in developing mobile applications and websites, User experience and User interface plays a significant role in our process. By creating a visual identity for clients we are building brand awareness, and by developing websites or iOS applications and Android applications that follow the rules of UX/UI design, we are painting a picture of a client.

So UX/UI design is really important and it needs to provide a great user experience!

According to Microsoft research 

• Average human attention span in the year of 2000 was 12 seconds
• In 2013 that number shortened to only 8 seconds 
• To compare, goldfish have a 9 seconds average attention span  

Table of contents

• What does this mean for the companies?
• So, how to get started with UX/UI design?
• What are the right UX/UI tools?
• Things to look out while designing
• Let’s look at some of the great UX/UI examples!
• Tips & Tricks from the master designer
• Read, learn and watch everything about UX/UI design

What does this mean for the companies?

It means the company will get only 8 seconds to capture the customer’s attention!

This is the reason why there is more and more talk about UX/UI design. Especially in the case of building mobile apps and websites. Since they are a way to interact with customers, their “beauty” plays a key role in customer behavior.

You want to make sure your site or app looks inviting as well as communicates the right message. It can be said that through photographs you will be telling your brand’s story and you don’t want to make a mistake.

That’s why we are discussing all the right ways to do UX/UI design. 

So, how to get started with UX/UI design?

Our UX/UI designer, Sonja Grubešić, is here to give you an insight into a world of UX/UI design!

She claims that every process should start with research and collecting information. It is important to have good communication with a client and know what exactly do they want.

p.s. Here are essential UX Statistics you need to know!

What message are they trying to communicate to their customer?

This may be the most important part of the whole process. 

Help yourself by:

• Take notes in the first meeting
• Make sure you ask a lot of questions
• At the end of the meeting, repeat everything to the client to make sure you got it right
• Send a follow-up report

Very often a client has an unrealistic vision of their website or mobile app. Especially when it comes to looks! You need to make sure you understand what their business is all about and even correct them if you believe the wrong message will be sent. Remember, you are designing for the users, not the managers! 

Once the initial part of collecting information is done, next step for UX/UI designer is to create a wireframe. By building wireframe they are creating an informational structure and the base for the design. Even though design comes at the end, it is the first thing customers see and that for, vital!

Once we had defined goals that website or mobile app is trying to reach, we are starting with the wireframe. That’s how we define the informational structure and how our website or mobile app is going to act. Furthermore, after the wireframe, we have a green light for development of visual content.

The design part starts with a collection of images and icons. Also by defining typography and colors that will be used. This is the part where those notes will be useful! Once you have everything in one place, you can start the designing process! 

What are the right UX/UI tools?

When it comes to UX/IU design, unfortunately, there is no right tool. Since there are a lot of different and useful tools you can use these days, every designer can pick the one he likes best or has the most knowledge for. Nevertheless, Sonja shared her favorite tools with us!

• SKETCH provides everything you need, from essential tools that help you work faster, to game-changing features that empower teams around the world. It is a great tool for digital design. 
• Figma is also a great tool for the whole team to use while designing. Through Figma, you can collaborate with everyone, at every phase.
• Adobe programs like Illustrator, Photoshop, and Indesign are always a great choice. You may need a little more knowledge and practice but it is definitely worth it. 

Things to look out while designing

Focusing on the looks and forgetting about the user experience!

Creating a successful design means also creating an excellent user experience. It doesn’t matter if site or app looks amazingly pretty if it’s not functional! That’s why when creating UX/UI design keep in mind to make it simple and not focus too much on “how it looks” part. Even designers can sometimes get carried away!

You can always find inspiration on awesome websites like Amazon or AliExpress that are combining functionality and ease-of-use with great design. 

Let’s look at some of the great UX/UI examples!

As seen in the video the company’s story of origin is told through great design. It is a combination of old photos and modern elements and it is perfect for a company that has been around for generations.

Furthermore, the colors that are used to represent the company are building brand awareness. So when customers are scrolling through the website, they don’t just see the information. They see the company! 

Another example of storytelling through UX/UI design is our client: an elegant mansion in Virovitica- Kurija Janković. By developing attractive, but a user-friendly website that represents the elegance of the mansion, we were able to reach more guests and increase bookings. The goal of a website was to be elegant.

By using more earthly tones and historically-looking typography we were able to transfer the emotion to the web.

Tips & Tricks from the master designer

Start with the audience

Whether you are building an app or a website, always think about the audience.
– Who is going to scroll through those photos?
– What are they expecting to see?

Remember, the goal is to reach more customers and we want them to love our site or app and use it regularly! So to deliver great design, you need to get to know your client, his brand, what it stands for and what is his targeted audience.

When you know this, you are going to be able to deliver a desirable design for both client and users.  

Think like a user

Now only that you need to know your audience but when designing, put yourself in user’s shoes. Don’t just think about the colors and what they want to see but the whole journey they are going to take once reaching your site or app.

From the first impression to how they gonna click or tap. By doing this you can escape making mistakes and possible corrections that are going to cost you money and time. 

Think about:

• Hierarchy – this includes the informational and visual structure of an app or website. As it was pointed out before, first comes the wireframe and then design. So the hierarchy is important because it’s going to build the layout of your app or website. 

• Be consistent – UX/UI design is different from editing photos because you are not just building pictures, but a whole line of photographs and icons that need to be consistent. For example, nobody wants to see a bright red photograph on the landing page and then scroll down to the bottom menu to see a brownish looking menu with different typography. So choose one to two photo filters/effects, one to three typographies and a color pallet. Also, be consistent in the layout so users can get around with ease. 

• Give control to your user – by doing so you are elevating user experience and making your site or app better. “Go back” or “search” buttons are great and simple ways to give control to the user. Furthermore, it not only about giving control but making it be seen. So make sure that the user sees the “go back” button, loud and clear!  

• Access – you want the website or mobile app to be accessible to a large number of users. If you make it simple and easy to use, you are going to reach this goal. So it has to look good but also accessible.

Read, learn and watch everything about UX/UI design

Last but not least, follow the trends!

Our UX/UI designer, Sonja is all about reading, learning and watching new trends. There is a lot of great material, tips, and lessons that can be found online but also by communicating with your coworkers and other designers. The world of UX/UI design is constantly changing and you need to keep up!

Also, you can find inspiration online on websites like Awwwards or by following your favorite brands.

Users get used to certain content and expect to see it everywhere. That’s why trends matter! You want users to be already familiar with your website or app, but make it different from the competition.

With UX/UI design you can make your site enough unique and tell a brand’s story. 

So, things to have in mind are:

• Listen to your clients, analyze the client, think about the brand
• Know your audience
• It’s not all about the looks 

Now you know how to tell a story with UX/UI design. If you want to know more, find useful tips on our Blog! Also, if you are a designer and have some tips to share, let us know on Factory contact!