UI/UX Design in Mobile app

4 years ago, when became to combatant iOS developer, i have a chance to outsource for a company (named it as LANWorks) that providing apps for doctor of Singapore’s hospitals. I won’t dive in business app because it’s useless to this article, just for an inspiration. Our app called Cure Mobile. You should be found it on AppStore with 2 versions, one is free and the other one is paid:

Free version. Click https://itunes.apple.com/us/app/cura-mobile-free/id642012171?mt=8
Paid version. Click https://itunes.apple.com/us/app/cura-mobile-unlimited/id641958024?mt=8

My team included 4 members and but without designer, that means we got all design from LANWorks. Ahh, miss, LANWorks never had developed mobile app before(they honest said that), they are only web outsourcing company, their designers have just skills with web UI instead. We absolutely worried to my company partner. Why did they dare to bid a project that has no experience on it? And then, we had to taken our big fault about application design. As you can see these above screenshots, let me show you some problems UI/UX relating on each screen.

  1. The background color is terrible.
  2. There’re much more items on a single screen.
  3. ’Cause has not space enough to item alive.
  4. The layout and interacting for each item so poorly.

At the end, the project was released with a boring and not happy from our developers. Into heart, we known that it was a failure product. Why i must say that? Please hear the second story i’m gonna tell you right now.

Collect it on the internet

Once upon a time, sounds like a fairy tale :) just kidding. There’re 2 coffee shop (A vs B)face to face on small street. A is only focusing to quality of coffee because the shopkeeper thought the gold keys of business success is quality,the attentive service. But B not do that, the B shopkeeper tell history of shop, the way to make a coffee cup which customer taste every time to come. He put a big TV on highest shop conner and rewind this movie a thousand time. After 2 month open, the B shop kept a larger customer than the A. WHY again? The simply answer is because the B shop made the feeling, leading customer to relax while drink coffee instead of came to the A shop and pay for couple coffee and chosen take away or staying hours. It’s nothing.

Look back to Cure Mobile app, it seems to be the same A shop case. Users don’t want to take an app with ugly design. It could make them exhausted, exhausted so far. Users not know your business inside so power or super huge ever, they only download your app to phone, see and touch somewhere on it, feel not good and of course, delete your app immediately. But if you intend to focus and give to your user a convenience, i bet that you will to be the B shop.

So, with mobile app, do you need to do what for user convenience ? That’s the purpose of UI/UX concepts i’m discussing. First of all, watch the short clip to show you what is the really UI/UX with Apple iPad Pro firm.

After done, you would feel unbelievable Apple’s product. That’s the power of minutely product. How could Apple do that? From Steve Jobs age, they always focus to detail, to user experiences, to thing that never be real with people in the world. In my opinion, it’s stress into 3 worlds: “Look and Feel”. You look at a beautiful thing, you would want touch it to know your feel. But if you think it’s not good, you don’t want touch it, see it though only once, right? Your product is same, too.

To make a friendly app, you need to learn the way to create UI/UX presenting by your app. I love that apps unconditionally.

You know, this pic is my viewpoint about UI/UX components. In other words, UI = Look and UX = Feel. Let’s get started with 4 items including: images, animations, ui components, colors.


Please take a look at this article. You will get a huge of experiences.


Collect it on the internet

Say you agree with me that animations are the secret of UX. It makes incredible feeling. Now a day, the billion $ app, you cannot found the app without animations. Never found. Even, those companies willing spend a lot of money to upgrade UX. Likes this:

Github source link: https://github.com/fruitcoder/ReplaceAnimation

Wow, cool? To ensure people don’t get bored while waiting for something to happen, offer them some distraction. This can be something fun, something unexpected or anything else that catches your users’ attention long enough for your app to load. Fine animations can distract your visitors and make them ignore long loading times.

Collect it on the Medium’s article

IDE provides you many components to make a app sense. For example, progress indicators. If you use traditional components be like:

Collect it on the Medium’s article

I guess that your use will feel not ok. But if you combine with animations, it will be better.

Collect it on the Medium’s article
Collect it on the Medium’s article

Or use Skeleton Screens likes Facebook or Medium:

Collect it on the Medium’s article

I’m a pure iOS developer, so i will see importantly colors with eye of developer. You design 2 screens, the same size, the seem format…but you’re using wrong color of them. That give you a bad thing and 80% your app should go the hell.

Collect it on the internet

With designer, they see color as original tip to save your app surviving among million apps on Appstore or GooglePlay. My advice is if you want to make an cool app, let’s hire a designer do it. Don’t design app alone. It’s really not helpful.

And last, i wanna share you some website about UI/UX supporting i followed:

  1. https://www.behance.net/
  2. https://dribbble.com/
  3. https://medium.com/tag/ux
  4. https://medium.com/tag/muzli

If this article is useful for you, please click ❤ and comment below. Let me know if there is anything you wanna share with me. Thank a lot, friends.

Like what you read? Give TuyenBQ a round of applause.

From a quick cheer to a standing ovation, clap to show how much you enjoyed this story.