Back

How Much Does it Cost to Create UI/UX Design from Scratch

High-quality UI/UX design drives engagements, keeps users from leaving your app or website, and makes money. The potential ROI for such UI/UX design development can reach up to $100 per $1 invested. It’s no secret, then, that good UI/UX design is beneficial in the long run. But how much does UX design cost? And speaking about design — what exactly are you even paying for?

In this article, we’ll analyze what factors influence the price of UI/UX design, and how long it takes to create it.

Reading time: 10 minutes

Table of contents

    Key takeaways

    • The cost of the UI/UX design and the timeframe depend on many factors and can vary from $5 000 to $10 000.
    • The key factors are feature planning, number and complexity of features, visual complexity, and the design team’s expertise.
    • To estimate the design cost for a particular project, you need to plan out epics and user stories, calculate the amount of time spent on designing every step of the user journey, and multiply it by the team hourly rate.

    What makes up the cost of UI/UX design

    Whether you’re making an app focused on breathing techniques or a website for tourists, UI/UX design cost is calculated in a similar fashion. When talking about the price, there are several key factors at play: feature planning, number and complexity of features, complexity of design elements, the design team’s expertise. Let’s take a closer look at them — keep in mind that the first 3 factors are specific to the app design cost:

    Factor 1. Feature planning

    When a startupper comes to a design agency to create an app, it typically goes two ways.

    • A startup founder already has a clear vision of the app and knows what features to include.
    • A startup founder has nothing but a vague idea for an app.

    In the second case, designers have to map out the user journey and determine features to include. They also have to outline the logic of each feature. For example, define how payments are integrated in the app. Finally, the team will need to get the client’s approval. An agency will have to spend extra time for that so the app’s design will cost more than in the first case.

    PetBuddy app design

    When developing PetBuddy, our client had vague ideas about features she wanted to include. We had to map out the app and think over the logic of every feature — like this chocolate calculator. It took us some time

    Thus, feature planning is the very first stage of the design process which influences its cost.

    Factor 2. Number of features

    More features in an app means more screens to design — it takes time, which is why it drives up the design cost.

    Let’s compare two apps that we developed at Purrweb: an app for pet owners and an ecosystem for nightclubs. The latter cost more to design as the app included way more functions and users roles.

    PetBuddy for pet careNoTab nightclub ecosystem
    • 1 user role: a pet owner
    • 5 user roles: guests, kitchen staff, admins, waiters, and dancers
    • A single user flow with a basic set of features — fewer design elements to create
    • 5 user flows with several features — which took longer to design and cost more
    PetBuddy screens

    The PetBuddy app required the design of screens for a single user role

     NoTab screens

    The nightclub ecosystem took more time to design simply due to the sheer number of features and user roles it has

    Factor 3. Feature complexity

    When talking about UI/UX design of an app, certain features may be more difficult to implement than others. This makes them more expensive to design.

    For example, think of an education-based app. Motivating customers to keep studying after each lesson can work two ways in similar apps:

    • You can show a screen that congratulates the user and simply tells them to continue.
    • Or think of gamification — integrate calendars with progress trackers, game characters, and the like.

    The latter requires additional screens and resources to map out its complex logic, so the design costs more.

    Gamification in DuoLingo

    Certain e-learning apps, like Duolingo, have quests and complex reward systems to keep users motivated. Designing them takes more time than creating a single “Congratulations!” screen — and costs more

    Factor 4. Complexity of design elements

    Style and aesthetics are a crucial part of UI/UX design cost. Its price will differ if a product or a website is either minimalistic or jam-packed with design features, complex animations, and interactive elements. Here’s a table showing the difference in visual complexity:

    Design elementCheap design with simple elementsExpensive design with complex elements
    • Icons, buttons, illustrations
    • Reused from other projects or bought from stocks
    • Made from scratch
    • Design elements
    • Static
    • Dynamic, animated when a user interacts with them
    • Branding strategy
    • Clearly defined branding strategy — designers won’t have to create it from the ground up
    • No branding strategy — designers have to go through several iterations to suit client’s needs
    • UI kit — a pack of icons and buttons to use in the app
    • The client already has a UI-kit
    • No UI-kit — designers create one themselves

    We worked on two apps with different visual complexity of design: Breathmethod and a medicine delivery app.

    Breathmethod is a meditation app focused on breathing practices. The general look of the app needed to have a certain effect on the users: calm and tranquility. To achieve the goal, we integrated photos, created animated elements and icons, elaborated a suitable color palette — and came up with the app branding from scratch.

    BreathMethod app

    The Breathmethod app design

    On the contrary, the medicine delivery app’s design is neutral. It has simple icons, monochrome color palette, and a standard layout.

    Pharmacy app design

    The medicine delivery app design

    Factor 5. Expertise of your UI/UX design team

    When you look for a team to create your website’s or app’s design, you’ll notice that there are many vendors ready to offer you their services. The website or application design cost differs vendor-by-vendor — it’s undeniable. Here’s what it’s dictated by:

    Experience. How many years has the team been working on UI/UX design? If an agency has a solid track record, chances are its services will cost extra. It’s still a good deal — the fact that they have many successful projects increases odds that your case is going to be among the ones that worked and earned their founders money.

    Type of agency and partnership. The price for design services  depends on the type of hiring and can vary wildly. A freelance designer may take less money but there is no guarantee that they will provide high quality. An in-house team can create a great and efficient design project, but it will cost plenty — the company has to find and sort through candidates, onboard new colleagues, and manage staff. An outsourcing design company strikes a balance in terms of price — yet it delivers solid quality which users adore. You can read more on how to hire app designers in the article below.

    READ MORE  How to hire a UI/UX designer who is curious about your product

    If we’re talking about outsource partnerships, the cost is typically defined in the contract. There’re hourly rates, which are considered the gold-standard of the industry of web apps.

    How to estimate the price of a UI/UX project

    As we’ve mentioned, there are several factors at play when we talk about the price of design. As for price estimation itself, here’s the approach that we use at Purrweb. It allows us to estimate the price of an app’s or a website’s design.

    Step 1. Plan out epics

    An epic defines one of the steps of a user’s journey. Planning it out is done after the market research and gathering the info needed to make a design project. With epics, designers and project managers can visualize generally the way a user is going to navigate websites, mobile or web apps.

    For example, think of a fitness app — we created one at Purrweb. It can have several epics: registration, a homepage with necessary features, and more.

    Fitness app design

    Authorization is a large part of user experience. It’s a single epic, and it can encompass several screens

    Step 2. Identify user stories and states

    At this stage, a project manager “divides” each epic. User stories are steps of a user’s journey, too — but they’re more specific, and they help outline which features to implement in an app. With their help, you can also estimate how many screens you’re supposed to make, and how complicated they’re supposed to look.

    Let’s return to the fitness app. In the “Homepage” epic, you may want to create such user stories as starting a workout session, checking the calendar, seeing different programs, etc.

    Fitness app design

    From the Fitness app homepage (on the left), a user can review other training sessions (on the right) — this is one of the user stories inside the homepage epic

    Step 3. Estimate a timeframe

    Finally, a business analyst and app designers estimate how much time it will take to design each screen or page — keeping epics and user stories in mind. They identify the number of hours to map out user flow, create wireframes (barebone versions of screens), and address all states.

    States of a feature define how it may work in different scenarios. For example, for a registration feature, the developer not only has to think about what happens if the user types a correct login, but also needs to consider if the user inputs a wrong password or leaves the form blank.

    This timeframe is multiplied by an agency’s hourly rate — that’s how you get the price for an iOS or an Android apps’ design. An approximate estimation breakdown looks like this:

    ui ux design price estimated

    Basically, epics are features described in broad strokes. User stories flesh this info out — they describe in depth each action the user can take in the app

    You don’t have to go through this time consuming process of calculating the price yourself. Purrweb will do it for you, free of charge. If you’re looking for a project manager, business analyst, or a designer — contact us using the form below.

    Steps to create UI/UX design

    Each company has its own process of creating UI/UX design. At Purrweb, we’ve completed over 300 projects over 8 years, including iOS and Android apps. So we’ve streamlined the process of design in order to complete it in the most time-efficient manner possible. You can adapt it for your own app development team — or you can hire us.

    Here are the necessary steps to create UI/UX design in a designated timeframe.

    Conduct market research and competitor analysis

    Our clients come to us with an idea of what their app or a website is about. But oftentimes they have no idea what the market’s like. This is where we can help — we can identify our clients’ target audience, or analyze other businesses in their niche to determine their strengths and weaknesses.

    Gather references and create a mind map

    We ask our client to find some examples of UI/UX design which they either love or dislike. This way, we’re on the same page regarding our clients’ app and website design — there won’t be unnecessary changes along the way which drag the process on.

    This is also the stage when we define features the app will have and create a mind map. The mind map shows how the app is going to work, and how users will navigate it.

    A mind map example

    A mind map for one of our projects — we usually create them in Miro

    Create wireframes

    They’re created to figure out where to place the content on a website and certain features in the app. Wireframes can also help to imagine how a website or an app will look like. Although you can’t test the wireframes with real users yet, still you can gauge the first impression of the app’s or website’s usability.

    Wireframes

    Wireframes help visualize where each feature should be placed in an app

    Make a solid design-concept

    We pick 3-4 screens and flesh out their design to visualize a core user journey through the app or website.

    The design concept is the stage when we get the final agreement on the design look and feel.

    Design-concepts often differ from wireframes — they look more complete

    Create prototypes

    Clickable prototypes allow us to test how the interface will perform and conduct UX research.

    Finish the design and create a UI-kit

    The result of the step is beautiful clickable prototypes and a UI-kit which we present to the client. At this stage, we explain certain design choices to our client: e.g. why we chose a particular font or a button design. The finished design can be passed over to developers or investors.

    The design of the Cryptowallet app. The finished design can be passed over to developers or investors

    How long does UI/UX design take

    Wonder how much time this UI/UX design process takes? Let’s take a look at an approximate timeline:

    ⚙️UI/UX Design step🕰Time spent on average
    Gathering references2-3 days
    Creating a mind map1 day
    Creating wireframes1-2 days
    Making a design-concept1-2 days
    Prototyping14 days
    Finishing a design-concept and developing a UI-kit14 days

    At Purrweb, we create a fully-fledged UI/UX conceptual design in about 1,5 months. In the end, the client gets a solid design of the final product.

    We executed this process while designing Fintarget — an app for beginner investors. The owner already hired a developer team, and the only issue was UI/UX design — we helped them with that. We implemented several features: authorization, user profiles, and investment strategy search. As a result, the owners got a web app and the mobile app version of the design. It took us 1.5 months.

    Fintarget app interfaces

    In 1.5 months, we completed the design of the registration page, a user profile, and an investment portfolios section

    Conclusion

    If you have an idea which you think will conquer the market, and you want to calculate the price and timeline of your project — contact us in the form below. We’ll get back to you in 24 hours.

    How useful was this post?

    Rate this article!

    8 ratings, аverage 5 out of 5.

    No votes so far! Be the first to rate this post.

    As you found this post useful...

    Follow us on social media!

    Share