Anatomy of a good design
Why should users choose your app from the bunch of other applications? From the users’ point of view, design plays the main role in initial impression — this is the first thing that users see when opening an app. Do you want users to open your app and fall in love with it? That’s why we’re here.
You need to make sure that the users not only use the app by themselves but also recommend it to others. If you are a growing company then a good design will make a pleasant initial impression on users and therefore attract the audience. In turn, the more features you want, the higher the mobile app design cost is.
There are several ways to make a pleasant first impression on the user.
Simplicity and clarity
To make the app simple means to make it convenient to use. The design here isn’t about how an app looks but how it works and how the elements are arranged logically. Use familiar symbols and phrases to make the app easier to navigate.
Icons exist to give users new information about actions — the main idea is not to make them beautiful and brand new but to make them clear. The icons should lead to the right place. It’s important not to reinvent a wheel but to use familiar and logical elements. Look at how icons are used in the app below. You immediately understand where these buttons lead— home, notifications, and so on.
Colors, illustrations, and animations should be combined and suit the theme of an app. People rarely like chaotic, flashy designs — this can alienate users. Compare these two designs. The first one has too many different colors, it looks clumsy. The second design also includes several accent colors but doesn’t look chaotic — all the colors fit together.
There is no need to overload an interface with unnecessary elements. There shouldn’t be lots of texts, and the format needs to be optimized for smartphone screens. To make the interface simple, place the key functions in the foreground, the content should be in the center of attention.
Tips and hints
If an app is complex it is necessary to give users tips: not only in difficult moments but through the entire process of onboarding. Onboarding helps users to understand how the app works — at this stage tips are crucial. Give users the opportunity to skip instructions because some of them download the app for the second time and onboarding is no longer needed.
No matter how beautiful your design is, an app is nothing without simple navigation. Use familiar patterns to make the navigation easier. After all, the more familiar — the easier to use. For example, hamburger menu is an outdated feature, and tab bar is native and intuitive. On the one hand, it makes all apps similar. But on the other hand, it is very important that the app has no obstacles for users.
Another tip: make button size comfortable for fingers. If the target audience is women, the buttons can be smaller than for men. Take the thumb area into account: most often we hold smartphones with only one hand. You need to make sure that all the main elements are in this zone, so the user doesn’t need to change the grip. The larger the display, the smaller the thumb area.
Choosing the color
The colors used in design may cause some associations. For example, red is a selling color but at the same time it is associated with errors. But designers try to avoid associations with colors — this choice is never justified only by association. Colors affect users’ feelings and attitude to your app. Don’t mix a bunch of different colors — the users will only get a headache. Sometimes color solutions are predetermined in advance, for example when a well-known company orders design. In this case, there is already a brand book with a certain color scheme and fonts selected by other people.
An app with a boring UI won’t help you maintain competition and attract users. Avoid copying the interfaces of competitors’ apps, or your app won’t differ from a number of similar designs — better create something new.
It is easier for users to navigate an app if the visual hierarchy is clear. Users need to understand what tasks the interface solves. Contrast also helps to build visual hierarchy: the main elements can be highlighted by color, size, or bold font. Less important elements are smaller in size. The hierarchy can also be created with the help of horizontal shifts. Elements that are interrelated need to be located closer to each other. Designers separate blocks by large distances and make elements inside blocks smaller so that they don’t conflict with each other.
Total design time × hourly rate = design cost
The cost of designing an app directly depends on two values: the time for the app design and the cost of work per hour. The mobile app design cost varies depending on how complex it is, who performs it, and also an important detail — in which country it’s designed. What else does the cost of designing an app consist of? Let’s look at the main design stages and how they affect the cost.
At the preparation stage, designers use mindmap. It is a block diagram that shows the visual relationships of screens or actions. This is a kind of app skeleton with all the basic logic. A mindmap can be created in different ways: some designers think every screen through, and others build the logic of the whole app without concentrating on specific screens. The main task of a UX designer is to think over how exactly an app will work. At this stage, there are no beautiful graphics, only the logic of the app, connections between screens.
Designers move on and create a wireframe — a rough layout of an app. There are low-fidelity and high-fidelity wireframes. High-fidelity wireframe is detailed, there may be some content already at the layout stage. In a low-fidelity wireframe, the text can be replaced with basic rectangles indicating that there will be some content. UX design is created to generally understand what kind of experience the user will get from your product. The wireframe shows how the interface elements will be arranged.
When designing an interface, take these nuances into account:
- All controls should be located at the bottom of a screen. Crafty designers place the «back» button in the upper-left corner so that it is difficult to reach.
- Users need to have the ability to control an app not only by tapping the buttons but also by swiping or holding certain interface elements.
On average, UX design takes two weeks of working time. The exact timeframe depends on the complexity of the app design. Design cost starts at $3,000.
Before the UI design stage designers create a moodboard. It helps clients to understand in which direction the designer thinks. We collect images, illustrations, patterns that we like and set the vector of the entire project. Then clients can express their opinion, whether they like the general idea or not, and share their wishes. Moodboard helps clients and designers to understand each other more easily. Plus, our designers ask clients for negative references. It’s great if clients have a clear idea of what exactly they don’t like and what they don’t want to see in a future app. If the client has positive references, we also take them into account but only some components — colors, fonts — not the entire structure of the reference.
UI design helps to breathe life into the prototype. Designers choose the color scheme, fonts, icons — all this makes up the appearance of the future app. This type of design is primarily related to aesthetics — how well the elements are combined with each other, is it pleasant to use the app, does the app correspond to the theme, goals, and objectives.
You need to follow some rules to create a nice UI design: the number of fonts in the app shouldn’t be more than 5-6 types of one font. As for the colors, don’t use more than 4-5 in the interface. The colors of the app should natively tell users which elements are clickable and which are not.
An essential principle of good UI design is arranging the components in the order of their importance:
— information should be divided by meaning, there should be no blocks within blocks;
— users need to have an opportunity to get the information in one swipe
— it is necessary to minimize the interface elements and leave only the necessary ones.
After the client agrees to the concept, the designer creates a UI kit based on the visual and logical templates of the app. Visual templates show the color and size of fonts and buttons. Logical templates show how the interface elements are located. UI kit is a file with elements in the same style to simplify the development process: you can program one button and then copy it to other screens. After the client approves everything, the designers begin to work out the interface states. There is an ideal state that users see most often, and there are states when you enter the app for the first time or when some error occurs, for example, there are many different scenarios.
What about animations and illustrations?
Images help to understand the main concept of an app. They can be in different styles but should reflect the idea of the app. This work takes about 16 hours. If clients need to illustrate unique characters then the design time increases and design cost too.
There are also animations except illustrations. They can hold the user’s attention, increase usability or make the app more convenient. Previously the terms ‘good UI’ and ‘animation’ were antonyms — animated images slowed down the loading of the apps. But now the devices have become more powerful and the animations are not so tasteless now. Animations add functionality and give new opportunities: for example, if you sell furniture — the clients can twist the product or even change the color, and play with it however they want.
UI design takes from several weeks to several months, it depends on the complexity of the design, the number of screens, and illustrations. The lower limit of UI design cost is $3,000.
Some companies provide post support but most often it’s not required in design. It’s great if the designer is in touch during the development stage to clarify details of the project if small edits are needed. If the customer notices some mistakes or asks to make changes, the designers can help.
You can count the mobile app design cost with simple formula: Total design time × hourly rate = design cost. How much does it cost to design an app? It’s not very difficult to calculate, you just need to know the hourly rate of a particular designer.
The price of one design project starts from $3,000. The cost of the final version of the design depends on many factors: style, the overall complexity of the design, illustrations, and animations, as well as the country if you want to outsource.
Our business analysts estimate the project with a lead designer. They make a quote with the app’s features. An experienced designer estimates how long each project will take. This approach helps us to avoid mistakes, and clients know about the deadlines and budget at the start.
How to reduce the cost of designing an app
There are some tips on how to reduce design cost without losing quality
Plan everything out. A good plan is half the battle. Planned work helps to reduce the design cost and have a clear picture of how the design will look in the result.
Hire professionals. An experienced design team will spend less time working on the project. So you’ll get the design faster and save your money.
Focus on the basic functions. The more functions you want to add to your app, the longer it takes to design them. You need to scope secondary features out and focus on the basic ones.
What affects the design cost
Cross-platform. There are 2 popular platforms for mobile apps — Android and iOS. You can develop an app only for one of the platforms or for both, it depends on your budget. If you want to conquer the world like the Beatles, then focus on both platforms. Despite the fact that Android is mainly used by the middle segment, the design for this platform will cost more than for iOS. Android has many versions and it’s more difficult to test such designs. Most often, the interface is designed first for iOS and then adapted for Android. At Purrweb, we specialize in cross-platform apps, so we create design for both platforms.
Geography. Design is a good reason to use outsourcing. Then mobile app design cost will depend on the country that you choose. For example, outsourcing prices in Asia are much lower than in the United States or Canada. In any case, check portfolios and reviews before hiring — so it will be easier to find a great specialist who meets all your requirements.
Functionality. The more functionality, the more time, the higher the design cost. For the first app version, it would be better to choose a simple design with a minimum set of functions. Customization of an app costs more. The advantage of custom design — it makes an app unique and different from the others apps. But the disadvantage of it is that the cost of designing an app is higher.
Customization is always interesting but it is important not to conflict with usual patterns. If the app conceptually looks great but it’s not usable — it’s bad. In any case, the designer’s task is to create unique things but not neglect usefulness.
Does price directly depend on country?
If you take the formula above as the base (Total design time × hourly rate = design cost) you can count the app design costs in your country, and also the cost in the outsourcing countries.
Let’s take Ukraine as an example. The average rate of a designer’s work per hour is about $50, the maximum time for developing an app design of average complexity is 250 hours. Total: 50×250= $12,500.
Designers from the USA have the highest rate — about $150 per hour. So one specialist can get about $63,000 for the design of an entire app.
Average design cost in different countries:
- The United States is the most expensive outsourcing partner. If you want to get their services, be ready to pay a lot of money. The average salary of a designer from the States ranges from $50 to $150 per hour.
- Specialists from Western Europe and the UK get $75-$100 per hour. Western European countries have a high level of technical education and there are many specialists in the IT field. Clients from America often order their services because of cultural similarities and a high level of knowledge.
- Asian countries have a huge flow of IT specialists, including designers. Their services cost much lower. Indian outsourcers work for $20-$40 per hour and Vietnam specialists get $10-$35 for their work.
How to choose the right one?
Choose a UI/UX designer as if you were choosing a father for your future child — seriously and responsibly.
The first tip here is obvious — you should look through the candidates’ portfolios. The portfolio reflects the skills of designers and also indicates their specialization. You just need to look through projects they worked on and then decide who can make a cool design for your business niche.
You can find a large number of professional works on different platforms. For example, freelancers post their works on Facebook and Instagram and you can find them by hashtags. There are also special groups dedicated to UI/UX design.
Another platform for creative people is Behancehttps://www.behance.net/PURRWEB. Experts all around the world post their works there, users can see and discuss them. The service offers a convenient filter system, an opportunity to comment and send messages. On Behance you can find everything — from simple designs to something innovative.
What about Dribbblehttps://dribbble.com/purrwebui? This service is a global creative community and there are a great many design works. Unfortunately, the service doesn’t have category filters but there is search by hashtags.
Talk to specialists and check their soft skills before hiring. Make sure that a designer is flexible, can think critically, and especially can foresight — if you don’t want to make a lot of edits during the process. The designer should be open to criticism if it’s reasonable, of course. It’s important to understand that people criticize only work, not personality.
Soft skills are necessary not only for designers. They are divided into 4 groups:
— Communicative. It’s logical to assume that it’s the ability to communicate. This group also includes leadership and empathy.
— Self-organizing. This group includes the ability to manage time and effectively perform any work.
— Creative. This is the ability to think outside the box and do things creatively, when it’s required.
— Stress-tolerant skills. It’s important for every employee to keep a sober mind and not panic while solving problems — from mini-problems with illustrations to disagreements with client
The best way to find a designer is to contact a web design studio with a whole staff of professionals. You can also hire a freelance specialist — this option is suitable if you need to do several micro-tasks. Freelance is a great opportunity to choose an employee for every taste. Plus, usually freelancers have much lower prices than studios, this way you can reduce the cost of designing an app.
If you want to go beyond the borders of your own country then use offshore outsourcing. You can choose a specialist from India or China and save money.
If you are in the IT sphere for some time then you probably know some UI/UX designers. Just ask for a couple of phone numbers and be happy.
6 things you have to pay attention to
Before designing both employees and clients need to focus on the following things:
- Do research
So, you have a brilliant idea for an app but what if your target audience doesn’t need it? If so, then you will simply waste your time and money. Study the market and existing apps, determine the needs of your target audience. You need to create a simple but engaging app design that will meet the needs of users. Study the target audience — gender, age, hobbies, everything you can find. It will allow you to understand the potential user better.
- Break, destroy
Break the stereotypes! Users need something new, something catchy. The spoiled user has already seen lots of similar designs. But to create something uncommon doesn’t mean to create something complicated. You just need to think outside the box and look at the world from another perspective. Add something that would make users come back to the app again and again.
People should not have any difficulties when using an app, so simplify everything that you can. For example, you can make the app memorize the users’ data so they don’t need to enter it every time they use the app. But if users still need to enter data then you need to make forms as short as possible — ask only for important information. Another useful way to make a user’s life easier is to customize the keyboard. For example, when you need to enter a number, then the keyboard suggests numbers, when email address — @ sign and so on.
- Calculate the cost
Before any business case it is better to estimate the approximate cost of the services. This should include all expenses — design, support, updates, etc. If you have a project in mind, contact managers of a design studio, they will estimate the project for you. This way you will calculate all the costs and decide whether you want to work with this company or will look for another one with a more suitable price list.
- Take interface features into account
When developing a mobile app, you need to pay attention to how users interact with smartphones. If we compare smartphones with computers — we spend more time with computers but use smartphones more often. That’s why an interface of mobile apps shouldn’t have any extra details. For example, the web version of Google Mail has additional blocks on the side but in the mobile app you can see only messages and need to tap for additional information.
- Think UI/UX design through
Sometimes designers want to create something flashy and forget the main rule — everything should be simple and plain to see. You also need to think about how to adapt the app for vertical and horizontal orientation — it should be convenient for the user.
Easy or difficult? It’s up to you
We have already determined that the cost of designing an app depends on the price of work per hour, the number of platforms where it will be released, and its complexity. According to the complexity, apps can be divided into 3 types: basic, medium, and complex.
Design of simple applications takes about 60-100 hours and the design cost is $3,000-$5,000. Such app design consists of basic UI elements — a couple of screens, a little bit of data and a few actions that the user can perform.
Design of a medium complexity app takes 100-200 hours and its average cost is $5,000-$10,000. An app of medium complexity has a lot of additional screens and well-animated transitions.
Complex apps are not so common — unique elements do their job: here you can find magical animations and custom illustrations. Design of such an app takes more than 200 hours and costs from $10,000.
As you can see, the costs of design range from $3,000 to very large numbers, it all depends on the hourly rate. Of course, the prices are approximate, all companies set different design costs.
If you have a logical question ‘Purrweb, how much will my idea cost?’, then leave your email and find out.