30-Day UX/UI Design Challenge

Prompts to help you enhance your skills and build a portfolio

If you want to become a UX/UI designer or you are simply feeling rusty, constant practice is a good way to go.

In this article, I'm giving you 30 prompts for you to work on — one per day.

💡 Tip
For those who are brand new to design, you can pick an existing app and replicate the screens from it to get used to how elements are laid out, including padding, colors, and visual hierarchy.

If you feel comfortable enough, my tip is for you to pick one or two products and build the screens for them so that by the end of the challenge, you can use the screens to create a case study.

Shall we get started?

1. Welcome screen

Here's the first screen the user will see when they open your application.

Companies often display a welcome message or a captivating tagline to show what they do.

2. Sign up page

Now it's time to design how the users are going to create an account to use your application.

Most commonly, the fields are first and last names and email. However, this should be adapted to the context of the product you are designing.

Reminders: Keep in mind that you want to lower the friction bar and only require essential fields for your user. On that note, consider if adding sign-up through socials is worth it.

3. Login page

Design the login page for users who already have an account.

Reminder: Your users will need to move from the login page to the sign-up page easily, and they should also be offered a way to reset their password if needed. Also, don't forget the log in with socials (Gmail, Outlook, Facebook) if applicable.

4. Password reset

There's nothing worse than losing access to an account. To prevent this, you will design the interfaces needed to assist the user in resetting their password.

It's important to offer clear instructions on what needs to be done and what they should expect from the actions they take.

5. User profile

Now you'll design the view of the user's account.

Again, you should consider the pieces of data that are necessary to your product and the ones that were provided when the user was creating the account.

Reminder: if you offer the option to change the profile picture, what will the default one be when they are new to the platform and haven't uploaded one? Also, don't forget to give them the option to update their information if needed.

6. Settings

This portion of the product allows the user to customize their experience with your product.

What are the notification options they can have? Can they make their account private?

For research, head to the Settings section of your most-used products and see how it's organized.

7. Error

In the case of websites and web applications, the user may look for a URL that doesn't exist. Design how this screen will be presented.

In the case of mobile applications, design how an unsuccessful attempt to perform an action will look like. It can be a toast message or a full screen. It depends on what will be best for your user.

8. Network issue

Imagine if your users are trying to load a page, but their internet connection will be lost. What will that look like?

Google Chrome made remarkable use of it with its dinosaur game.

9. Navigation bar/menu

Whether you are designing an application, a web app, or a website, your product likely has different pages or sections. You'll now design the navigation bar/menu, showing where the user can go next.

10. Offerings/catalog

It’s time for you to create the catalog of products or services that you are selling to the user.

Whether you are designing a new e-commerce shop or the app of a restaurant, this will be the page featuring the products or meals that the user can purchase.

For inspiration, head to Amazon.

11. Search engine

A search bar is always helpful for users to easily find what they are looking for. Design the interfaces for the search feature.

Reminder: Take the time to work on how it will look once results are found and if no results are found at all.

12. Checkout

Design is about meeting the user's needs while minding the business goals. For this reason, checkout is an important step, as you want to make the process seamless and quick.

For inspiration, head to Apple and see how it is to pick an iPhone and make the payment.

13. Pop-up/overlay

A pop-up is a temporary graphical element that appears over the current screen, often used for alerts, notifications, or additional information. It provides a focused interaction without navigating to a new page, enhancing the user experience.

An example is online stores that offer an extra discount if you sign up for their email list. This pop-up shows right in the center of the screen, making it hard for the user to miss.

14. Notification center

Something important happened? A notification tab may be helpful to alert the user.

Design how notifications will be displayed.

15. Email notification

Your product may trigger email notifications to alert the user when certain events happen, as they may not see the notifications within the application right away. In this task, you will design how the email will look.

You can pick the email of your liking. Some ideas are password reset and order confirmation.

16. Progress tracker

This is to show the user how much there's left to complete something.

If they made a purchase, the progress bar may tell them what stage it's currently in (order placed, order confirmed, order shipped, delivered). If we are talking about a habit tracker, it will indicate how far they are from the goal.

17. Map/location tracker

Some applications may require you to show a location. Design how the map will look like and an indicator of the position.

Tip: head to Airbnb and check how they display the location of the accommodation.

18. Order review/rating

To ensure the product keeps evolving, it’s crucial to listen to feedback. Allow users to rate or leave a review about their experience.

This feedback is not only helpful to the company but can also be displayed to other users, boosting confidence in the product or service, similar to how Amazon showcases reviews during browsing.

19. Direct messaging

On Day 19, your task is to design the look of a chat within your product.

Reminders: Will users have the option to react to a message? Will other features be needed, such as saving, editing, and deleting messages?

Take a look at your favorite messaging tool (eg: WhatsApp, Telegram, Messenger, WeChat) and identify important elements that enhance your experience.

20. Admin panel

How will the company’s team manage customer requests? Your task now is to design the view for team members.

For example, if you are designing an app for a restaurant, this would include the restaurant’s perspective on aspects like client orders, chats, and customer reviews.

21. Onboarding flow

You know when you log into a portal for the first time, and it offers you a quick walkthrough, highlighting the features and how you can do certain actions? That's what you will be designing.

A good onboarding process boosts user adoption and stickiness, as users will have clarity on how to use the product.

22. Leaderboard

This applies to products where users earn points and occasionally compete against each other. The leaderboard will showcase those in top positions.

Note that the appearance of a leaderboard may vary depending on the product. For instance, in the case of X, the trending box might display the leaders in terms of content.

23. Dark/bright mode

Offering the option to change the appearance from bright to dark mode is not a nice add-on. A dark mode interface can improve readability and accessibility, making it a must.

In this task, you will pick one of the interfaces previously designed and change it to dark mode. If your product is already in dark mode, design a bright look.

24. Social share

The application may offer the option to share content on the user’s social media channels.

For example, you can share a song you are listening to on Spotify through Instagram stories.

Adapt this feature to the context of your product.

25. 2-Factor Authentication

Ensuring safety increases user trust in a product. Here, you will design how users can activate and deactivate 2-factor authentication, and how it will be required during login.

26. Event registration

Create the interfaces for users to sign up for an event that is being announced inside your product.

For inspiration, you can look into Eventbrite or Facebook's Events.

27. Referral/points program

Companies offer a reward program if users refer the product to friends or purchase items. Think of the best way to go around this in the context of the application you are working on.

28. Subscription management

When products are subscription-based, it’s essential to consider how users will manage their subscription, with the option to upgrade, downgrade, or cancel it.

For inspiration, you can observe how services like Netflix and Spotify handle this.

29. Help center

Your users may need extra assistance to get around. Design a help center with articles on how to perform certain actions.

Tip: Design the appearance of the categories and also how the articles will look once open.

30. Log out

All done? Now design how the users will be able to log out of their accounts.

If this option was already displayed when you were designing the settings, an alternative is for you to design how the users can deactivate their accounts.

I hope these prompts make you level up your design game.

For more content on being a designer in tech, here's my YouTube channel 📹🤍