Design

Top 5 Mobile Interaction Designs of November 2021

November 25, 2021

It’s hard to believe that the end of the year is almost here. As temperatures stay cool and daylight is suddenly minimal, designers around the globe have been busy cooking up mobile interaction designs that reimagine how we tackle food waste, mental health, and more. Read on below to explore the mobile app designs of the month. 

1. Rental Marketplace App by Purrweb UI

Scooters are all the rage in many cities around the world. This mobile app design concept takes more of a sharing economy approach in that the scooters are owned by a certain person who rents it out to others on the app. The starting interface reminds us of Instagram or Facebook, with a stories feature near the top of the screen. Below it are a number of options the user might want to tap into, the first being a scooter rental tab. Swiping to the right advances the cards, showing the user different options they might want to rent. Tapping on a scooter sends the scooter images zooming in either direction off the screen, and then the exact model image scoots back onto the top of the screen, while the pricing option buttons slide onto the screen from right to left as well.

Source: Dribbble

2. Neap Mental Health by Phenomenon Studio

Keeping track of how you feel and what you do each day is a great way to find patterns and engage in healthy activities. This mobile interaction design walks us through a mental health app that aims to help diabetics. The app tracks myriad health metrics and, in particular, shows how a user might enter in daily mindfulness data. Tapping on the animated characters that correspond to certain feelings helps the user track their mood. And swiping up to explore more of the page eventually gets the user to the water intake section, which was our favorite part of this mobile interaction design. When the user taps on one of the plus signs in the water consumption section, it turns into a glass of water, visually tracking their hydration for that day.

Source: Dribbble

3. Foodsi App by Łukasz Samiec for Objectivity

Two unfortunate issues are happening simultaneously in some places in the world: many people are food insecure, while others waste food. Foodsi aims to connect the two groups to help restaurants sell their leftover food at a discount while it’s still fresh. Users can scroll through options in their area to see what looks appealing or use the map feature to see what is closest to them. The deep discounts are displayed with original prices in gray crossed out and slightly larger sale prices to the left in black. Tapping on the green pin button slowly lowers the restaurant options until they’re off-screen, and up comes a grayed-out map until the nearby food options load. Then users can tap on one of the options that populates in a card at the bottom of the screen. As the cards advance, the view of the map moves along with it, showing where the restaurant is. Then tapping on one slowly brings up a delectable picture of the food and pickup information and the ability to buy.

Source: Dribbble

4. LiveChat by Bartlomiej Otlowski for LiveChat

As we enter the holiday season, many of us start our shopping to get something for everyone on our list. Live chat has the potential to help, but usually, it feels pretty robotic. This mobile interaction design shows what could happen if live chat machine learning was advanced and fast: the user enters their request, and within seconds, live chat populates some products that fit their specifications, complete with product name, image, price, and the ability to tap a button to skip right to checkout. As we work on our holiday shopping, we will certainly be wishing that the live chat feature within mobile apps and even websites was this easy.

Source: Dribbble

5. Navigation Menu by Mr.alidoost for Piqo Design

And, as always, we’ve left a small interaction that has a big impact for last. This tab bar has a lot more movement in it than most we’ve seen, as each icon turns purple and moves around when tapped. First, the hanger serves as a shopping icon and jumps up and sways from side to side when tapped. Next in line is the discover icon, which spins and has the squares switch places. In the middle is a bookmark icon that flaps up as if it’s a flag in the wind. Then the cart icon that looks like a purse opens and closes. And lastly is the profile icon, which looks like a person tilting their head to the side and then back. It’s definitely different to have words also pop up as the icons move, but some of them aren’t the most intuitive icons for the area of the app they’ll take users to, so maybe they’re worthwhile, at least for new users.

Source: Dribbble

That’s all for November but be sure to check out last month’s edition, featuring the best mobile interaction designs of October 2021

Feeling inspired? Proto.io helps you bring your idea to life in no time, with no coding skills required. It’s ideal for UX designers, entrepreneurs, product managers, marketers, students, and anyone with a great idea. Sign up for a free 15-day trial to start building your first prototype today!

Author