Best 20 Example UI/UX Design For Mobile App | UI/UX Animation Design

Подписаться 31 тыс.

Просмотров 623 тыс.

50% 1

Begin an easy and fast prototyping here : bit.ly/3gKEsV2
This is the #Part4 of Design inspiration for you guys. This 20 Example UI/UX Design For Mobile App got pick from Dribble. You can follow the designer on link below, thank you & hope you enjoy it, cheers :)
Hire Mobile App UI/UX Design Experts For Your Next Big Project. Click below:
www.a3logics.com/mobile-app-d...
Please Subscribe! ❤️❤️
We upload a new video every Thursday.
🔴 Source: dribbble.com/
-----------
dribbble.com/adamprzewoski
dribbble.com/Khoroshok
dribbble.com/AlperTornaci
dribbble.com/keeplegend
dribbble.com/kadaayoub
dribbble.com/cadabra
dribbble.com/Chrisiwan
dribbble.com/cuberto
dribbble.com/Zavistovskaya
dribbble.com/kurtcepe
dribbble.com/dmitrybercan
dribbble.com/excited-agency
dribbble.com/martinehrlich
dribbble.com/mnieckarz
dribbble.com/ofspacedesign
dribbble.com/outcrowd
dribbble.com/remcobakker
dribbble.com/ui_migulko
dribbble.com/Tubik
dribbble.com/YanBin_Tan
🎵 Music Credit :
-----------
Feel Better by Roa Music / roa_music1031
Creative Commons - Attribution 3.0 Unported - CC BY 3.0
Free Download / Stream: bit.ly/feel-better-roa-music
Music promoted by Audio Library • Feel Better - Roa Musi...
------------------------------
Upbeat Corporate by JP Bianchini jpbianchini.com
Creative Commons - Attribution 3.0 Unported - CC BY 3.0
Free Download / Stream: bit.ly/upbeat-corporate
Music promoted by Audio Library • Upbeat Corporate - JP ...
------------------------------
Harmony by Ikson / ikson
Music promoted by Audio Library • Harmony - Ikson (No Co...
❤️ Social Media :
-----------
/ itsmebfg
⚠️ : Important
----------
*Like & Share if you enjoy the video!
*Subscribe to stay up to date with upcoming video tutorial, design inspiration, UI Design, UI/UX Design, Adobe Illustrator, Adobe XD & Design Graphic.
*Note: Please report to (itsmeuxiudesign@gmail.com) If you have any issue with this content, and I will remove the content ASAP.
----
#UIDesign #UIAnimation #UITrends2020 #DesignInspiration

Хобби

Опубликовано:

11 мар 2020

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 314

@sengv1987 2 года назад

funny thing is 90% of the time the final development app never look like this. Dev are are going to complain and say the API is incapable of doing such animation for the UI element is bloating causing the app to slow down. what a sad world we live in

@KL-oj2my 2 года назад

it's because designers don't take in account what actually needs to be done to realise the design in IRL

@thatsalot3577 Год назад

@@KL-oj2my yeah I remember the day when my friend gave me a ridiculously difficult UI design for a react app as a figma file, I don't even wanna talk about how messy css I had to write for that. It slowed the development speed and website as well.

@morgard211 Год назад

@@thatsalot3577 now I'm curious about how it looks - do you have a screen from that design?

@deanuziel4545 Год назад

As a developer, Personally I take the challenge and try to do my best to achieve the same feel and look of the design

@thatsalot3577 Год назад

@@morgard211 to be honest it turned our really awful, and I'm ashamed of it, but now I'm working with D3 (and I know there are a lot of wrappers and stuff) But I think I needed a different set of tools for such kind of applications.

@himansuthapa8748 4 года назад

I feel like 0:58 has a great animation but bad UX/UI. Just imagine if I were to buy 15 pizzas and next thing you know I would have a stack of 15 pizzas to scroll over. The same principle applies to the pineapple lemonades and mushroom burgers. As a designer, we should make the user life easier to navigate. Don't get me wrong the design has a great animation but it lacks the fundamentals of User experience and Interface.

@qwerasdfhjkio 4 года назад

Didn't think about that!

@abraiyan7984 4 года назад

There wouldn't be 15 pizzas. It would be three or four and that's it. Like the coffee cups. 2 cups will be visible and the rest of the cups won't be visible. Its a listview.

@TheBlingm 4 года назад

@@abraiyan7984 More important is the question if you had 7 pizzas lets say, which can probably happen if you throw a party, than this UI element is overkill in my opinion. Sometimes delivering a piece of information in the form of a text is much more worthy than an image stacking on top of each other.

@abraiyan7984 4 года назад

@@TheBlingm listen, if you order 25 pizzas, maybe the UI will show just 2 or 3 then ...

@abraiyan7984 4 года назад

@@TheBlingm but ya, text is a good option. Nice thinking

@MrUtoobee 4 года назад

Best examples of animation should be combined with how it has worked successfully for users.

@sanjitselvan5348 2 года назад

Thanks for showing some great designs and the UX behind them!

@newagemood 2 года назад

cheers mate :)

@newagemood 4 года назад

Don't forget to like the video if you enjoy it, cheers :D

@yusufit7627 3 года назад

Seeing these ui designs helped me feel relaxed when I was tired

@newagemood 3 года назад

Haaha, true :)

@chrisfahie2767 Год назад

This is the best free software Ive seen. Respect.

@dustinoverbeck 4 года назад

Interestingly enough I see two different people I’ve hired for projects featured in this list.

@HopeAdoli 4 года назад

Wow interesting. How was your experience with them? in terms of keeping to schedules, delivery and quality of work?

@curefromhappinessyo139 3 года назад

You must be rich

@dustinoverbeck 3 года назад

Hope Adoli one was an agency and had a professional process. Unfortunately we hired them for a 3D project and they weren’t able to deliver. We cancelled the project 3 or 4 weeks into the process and needed to hire an agency that had the skills. The other was a freelancer and he delivered good work. He was, however, a bit difficult to work with and was “high maintenance”. We had done two projects back-to-back together and I wanted to continue the collaboration, but we had creative differences.

@dustinoverbeck 3 года назад

@@ab-kx1vg your comment doesn’t make sense to me. What is it you were trying to say?

@PubgMobile-tc9uv 3 года назад

@@dustinoverbeck I wanna work for you, freely

@mastercode7851 3 года назад

everybody: this is amazing WOW!! the guy who will code this : O_O

@biiiiiimm 3 года назад

Ahah but it's funny to code this kind of stuff. Coding boring stuff is boring lol

@mastercode7851 3 года назад

@@biiiiiimm it's not boring it's complex

@aiyushg1769 3 года назад

@@biiiiiimm I completely disagree, the coding is the problem solving which makes it frustrating but definitely not boring. But you get tonnes of reward when something works.

@biiiiiimm 3 года назад

@@mastercode7851 Ohhh sorry my english isn't that good ^^ i wanted to say : i prefer to code this kind of stuff. It's challenging so not boring ^^

@biiiiiimm 3 года назад

@@aiyushg1769 i totally agree. Just my english is abviously inaccurate ^^

@Cyber79 2 года назад

Great look... but how much is difficult to implement? And regarding the performances?

@vladkuprienko7162 3 года назад

0:54 WoAHHH... Insanely beautiful!

@newagemood 3 года назад

ikr :)

@AbualHassanPervaizAkther 4 года назад

Its more like UI ANimations than UX Design examples. Most of these are distracting users. lovely animations though.

@sakshimudgal8809 3 года назад

Distracting ? How i just wanna know .I m new to this.

@SaSha-hb5rq 3 года назад

@@sakshimudgal8809 From a developer's point of view, in some particular design the animation is overused which is distracting the user from the main activity. The animation should be there to grab user attention with micro-interaction animation.

@sakshimudgal8809 3 года назад

@@SaSha-hb5rq ok got it👍

@biiiiiimm 3 года назад

From my point of view, micro animations should makes the app more "natural" without disturbing the interaction or making it heavy. The first one, for example, do the job perfectly i think.

@sucram1018 2 года назад

@@SaSha-hb5rq Is it really distracting like it's preventing you from getting you where you need to go because there's so much going on or you just think the interface shouldn't be used in every part of the platform? There's a difference, context is important.

@bharathkandula526 3 года назад

Firstly congrats to the hard work, who did this. Ui Looks very nice, the chosen in u r app is very simple to take. This is the main advantage of work. and the bad thing no one shows how to convert them into a working app or XML code.

@newagemood 3 года назад

Thank you so much 🙂, yeah soon we will have Development series using flutter.

@andrei8683 2 года назад

exactly

@souradeep8273 Год назад

It is easy to design them, not to code them.

@lifetravelcook 2 года назад

Looks really great, nice animations, but to code all of this will take time and money. Seems client should be having very big project budget.

@danielcontrerasdecenteno5969 3 года назад

I love it 💯❤️

@hemantprajapati1118 4 года назад

like the second one

@eucerinfool 4 года назад

This is so cool!

@newagemood 4 года назад

hope you get some inspiration from this :)

@RhazYassine 3 года назад

amazing works. Thanks for sharing :D

@newagemood 3 года назад

Thank you! Cheers!

@adamstuartclark 3 года назад

The bank transfer flow does look really nice but this assumes that everyone has an image. Otherwise this won't work. In my experience fewer people than you'd expect actually bother to populate an avatar image.

@danielebadiali9921 Год назад

Thank you very much for your key......1000% work :)

@newagemood Год назад

Enjoy

@Jihwankim22 4 года назад

When making the individual menu icon and texture on it on the app design, what program usually use? illustrator?

@newagemood 4 года назад

Yes, you can use illustrator to make the icon.

@dyankog Год назад

It works! Thanks a lot.

@newagemood Год назад

Enjoy

@ryanfernandez141 3 года назад

well done lads, good job....

@newagemood 3 года назад

Glad you enjoyed it

@arsalananwar5116 2 года назад

THis looks so easy. But behind the scene, it has great effort. looks simple and nice

@otoS97 2 года назад

None of them are implemented tho. Some of then are so complex it would not worth money and time to implement.

@salsichalivre5401 2 года назад

@@otoS97 exactly

@MASTERPPA Год назад

As a client, having a app developed, while I love the animations, I am telling my coders fast over pretty. If the app takes 1/4 of a second longer to go from screen to screen, that apps up fast for a driver using it to track things.. I personally hate animations since I am all about speed..

@Akash-hs8nl 3 года назад

Wow, Your Video is awesome!!!

@newagemood 3 года назад

I'm glad you like it

@pratyush4266 3 года назад

Such a big designs woow😍😍

@newagemood 3 года назад

Thank you! Cheers!

@itzmehrshad3433 2 года назад

Great!

@MathiaLiu 4 года назад

awesome ideas & designs

@newagemood 4 года назад

Glad you like them!

@vijayuiux2453 4 года назад

Cool😘👍

@ernanijunior2468 Год назад

So perfect

@jacekmaka403 Год назад

You really good at explaining thank you

@newagemood Год назад

Glad it was helpful!

@nwctvm4017 3 года назад

6.10 its good task planner

@salmanalamoudi6091 2 года назад

But how implement it in android studio some ui you can't for example custome progress bar it hard to create it the same

@WolfieLikesCake 2 года назад

I’m struggling to see the ux in a lot of these e.g. a searchable list is a lot easier to navigate in a banking app than floating bubbles 🤔

@youtubeessentials6434 3 года назад

complex Animations maynot be effective for low end and mid-range devices

@Dr_DNA 3 года назад

Awesome

@diegovelmen 3 года назад

These are cool, but you would never get such fluidity once it gets developed.

@sakshimudgal8809 3 года назад

@joanacodes7042 3 года назад

I thought the intro was an ad and I got ready to skip

@Zazzic 2 года назад

I really like the beat

@rm.p 4 года назад

How I can use these all !?

@aliasgar.burhani1099 3 года назад

Damn Designs are amazing but just think of the one who codes this lol

@newagemood 3 года назад

Hahah

@fredrickdenga7552 2 года назад

Mahn I love that music

@deobyeol8083 3 года назад

Can anyone let me know the font name they mostly used? >

@pavantodupunuri2562 3 года назад

It is really overwhelming to even look at, and not in a positive way. Like someone said in the comments section, animations are lovely though.

@sucram1018 2 года назад

Is it really overwhelming? It doesn't even look complicated!!

@oqba 4 года назад

I think we need 9Gb of ram to run those apps 😅

@adfinemrising 4 года назад

are you sure?

@HopeAdoli 4 года назад

😂😂😂😂😂😂😂

@ugochukwuekwueme575 3 года назад

🤣🤣🤣🤣

@zdenekdvorak4346 Год назад

thank you!!! video liked and u got a well deserved sub from me!!!!

@newagemood Год назад

Glad I could help

@mazudhafiz1778 3 года назад

good reference

@webtutorials5353 4 года назад

Nice design 👍

@newagemood 4 года назад

Thank you! Cheers!

@DesigningMantra 3 года назад

perfect👌

@newagemood 3 года назад

Chersss :)

@LuluFrance Год назад

Hello, this was awesome. I'm trying to understand the full flow of this UI Process. I want to have a mobile UI for my very small little business, that clients fill in details. My question is where do these details go? Is this component of the flow part of the UI design or is it 'something' else. Thank you!

@newagemood Год назад

Just write a brief first, like what style you want, how much screen you need, and the flow of the app if you have it, also include the rough sketching, have a meeting with your vendor, then discuss that brief.

@LuluFrance Год назад

@@newagemood Thank you, most helpful!

@Hussain-sl2cj 3 года назад

where I can learn ui animation like this

@sashi3395 Год назад

on the second design I would prefer to have a number on the top because imagine if the user order 10 pizzas, we gonna have 10 box on the screen that would take too much space

@queeso2212 3 года назад

es idea mía o es la misma música de intro de Cecilia kookmin?

@ramithrathnayaka8551 3 года назад

She will create intuitive and functional UX UI designs. a freelance UX/UI designer who translates your business requirements into modern, professional

@madhawapriyashantha3722 4 года назад

really beautiful.i don't know how to create such beautiful ui.i tried learning fundamentals colors,spacing,typography etc.but still cannot get uis to look good.can you give me a advice ?

@newagemood 4 года назад

Just keep practice and share your design, dont judge your own design let them give the feedback, so you can learn from it.

@ytrpaz Год назад

Amazing.what tool did they used for interaction?

@newagemood Год назад

You can use AE or Principal.

@ananthnaren9183 4 года назад

Im a ms software engineer graduated and Its my firm desire to become ux ui designer , its my dream and wish to learn more.

@newagemood 4 года назад

Hey, good luck with the process to become UX/UI Design. I hope this chanel can help you :)

@ananthnaren9183 4 года назад

@@newagemood thanks , this channel is cool and helpful for me

@newagemood 4 года назад

Thank you, you can subscribe this channel and get notif when the new video out.

@SimplyJessy041782 2 месяца назад

That's why i like using canva all my project

@newagemood Месяц назад

Wait, you design on canva?? that's awesome 🙂

@marselgaliullin 3 года назад

how to record such smooth animation, on which program? Let's say I made a design in Figma, then a prototype, how to record it?

@newagemood 3 года назад

You can use ob studio mate :)

@Xynic48 3 года назад

Really nice animations but the developers definitely arent going to be happy trying to implement that.

@sensationw86 2 года назад

🤣

@mdesignedofficial 2 года назад

I like how the 2nd one if you look closely you can see the tallest building in Dubai and he said it's in Singapore Xd

@SupahNin10dohp 3 года назад

Also, why do these never look as good when developed into an app? And is it possible to have these smooth animations in the final app? Especially now that we have high refresh rate phones?

@zero1451987 3 года назад

Because coding and animation are two separated things. This is why designers should learn to code as well.

@thatsalot3577 Год назад

Because it's turns your codebase into a mess, you'll be running more functions to keep track of an icon than the actual required code. Plus it slows down the app reall badly, you and I might have fancy phones but there'll be a lot of devices where it just wouldn't work properly and that's bad for your sales.

@muhammedlokmanpursali6057 Год назад

I like the application at the end. Can we have you do the application in the style we want in exchange for money?

@newagemood Год назад

Email as here itsmeuxiudesign@gmail.com

@rikadfauzialawi2092 3 года назад

2:00

@AvivaMartin 3 года назад

How do they get these interactions to move so much? I'm just starting out and my mock ups on adobe xd and figma are pretty static, these are almost like videos of ui

@newagemood 3 года назад

Use AE if you want much move in your interaction :)

@sengv1987 2 года назад

No need for all the crazy animations/movements. as long as the interface showcase the pain point of the product it's good enough. dont waste so much time on making a screen/mockup look pretty, because PM, Dev and stack holders are going to tear it all down during reviews.

@sucram1018 2 года назад

@@sengv1987 So having a good looking interface is bad?

@amerika8803 3 года назад

Is there any tutorialgor thesekindanimation

@taruntosh7970 4 года назад

Intro music ? Pls

@SupahNin10dohp 3 года назад

I really want to get into UI/UX design but don't know where to start. I'm currently in CyberSecurity with a background in Sys/Network Administration. Does anyone have any tips for an accelerated learning path? It really is my passion.

@andyli2927 2 года назад

Any luck/Update?

@agcamprubi4544 10 месяцев назад

Google UX Design Certificate

@preenxus3425 4 года назад

Программисты нервно кусают ногти)

@jemelgash9677 2 года назад

I love all the designs. What music track is at 5:19? I really like it.

@newagemood 2 года назад

Mate, my bad, forget the music tittle, i think all of music we put in the description :)

@jemelgash9677 2 года назад

@@newagemood Great, thanks.

@digitalworld3073 3 года назад

Bro. That intro music ! What's the name ????

@seoulkimchi50 4 года назад

do you transport Mock ups from XD or sketch to AE then make it animated ? Please share me some insights on how you can make this because i wanna learn and I do not know how to

@newagemood 4 года назад

In XD version 13 you can export your designs from XD to After Effects already. So you can animated your design per layer or artboard

@seoulkimchi50 4 года назад

@@newagemood so all these designs are made from xD? I wanna make prototype in those level of quality plz do tutorials!!

@newagemood 4 года назад

@@seoulkimchi50 Not really, it maybe figma or sketch to.

@seoulkimchi50 4 года назад

Any tutorial or recommendation where I can learn how to make that level of prototype?

@newagemood 4 года назад

@@seoulkimchi50 you can learn here ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-KRDKQnGUsTg.html

@littletwoho2 2 года назад

hi, i am a web development student, may I ask what tools or software or programm to do the animation like this?

@newagemood 2 года назад

You can use After Effect, Protopie, or Principle to animate your design.

@UnitySimplified Год назад

you got new subs

@newagemood 10 месяцев назад

Glad it was helpful!

@abdulrahmanal-droubi8696 3 года назад

Wow . Is it designed with Adobe xd or after effect? Hope you can tell me

@newagemood 3 года назад

Both

@abdulrahmanal-droubi8696 3 года назад

@@newagemood okey thanks

@MohanaKumar-xy5xm 2 месяца назад

Okay so how are they animating these!? I mean in chih platform! XD, Figma are limited do thry use After Effects to make these animations!?

@newagemood Месяц назад

You can use After Effect or Protopie to animate this design.

@comdeybaba1326 Год назад

Ye kaise banate hai is pr video honi chahiye 😊

@khushbookumari-rt7pt 2 года назад

where does get all this animation? Like which software do they use?

@newagemood 2 года назад

You can use Ae or Principle to create this type of animation.

@Fatrabbitnetwork 4 года назад

Where can I find someone to do this stuff? I need some serious animations. Someone hit me up with a list, we got the $$$ real stuff searching hard. Lemme know

@newagemood 4 года назад

go to dribbble or behance, or if you want a cheap price go to fiverr.

@magoktec7114 4 года назад

We are design Firm , let me know what you need and we will design it for you !

@mottoprint 3 года назад

@@magoktec7114 you have no content

@magoktec7114 3 года назад

@@mottoprint We dont showcase on youtube . If you want see our works then email us !

@internetdesign10 4 года назад

what software does most designers use in designing the mobile app?

@newagemood 4 года назад

You can use Sketch, Adobe XD or Figma.

@internetdesign10 4 года назад

@@newagemood thank you i will try adobe xd :)

@cadxpert8536 2 года назад

what software do they use to make this animations?

@newagemood 2 года назад

You can use principle or after effect to make the animation mate :)

@rohits.7752 Год назад

Hey man, I already have a flutter application but I wanted to share my personal project on git and LinkedIn. So, I wanted to know how can I make these small videos which look dope!.. Appreciate your efforts man!.. anyone pls help

@newagemood Год назад

You can use after effect & premiere pro.

@koenterheegde9328 3 года назад

How can you create something like this or implement it? I have no clue where to start.

@newagemood 3 года назад

Start design the interface first, you can use Figma or Adobe xd, than use flutter to implement your design :)

@shubhamranawat749 3 года назад

Can you give the code for this ui

@rajeevpal4322 2 года назад

where to i download adobe illustrator for hp probook 4440s plse tell me

@newagemood 2 года назад

Creative cloud.

@QuantuMGriD Год назад

While all these look very cool, why are these kinds of UI/UX designs not actually any where to be seen irl?!

@iamsajid15787 9 месяцев назад

When a Designer laughs programmers cry...💔

@kailashsriram9862 4 года назад

how do they create these?

@newagemood 4 года назад

The animation using AE

@piolaa 3 года назад

What applications are used to create designs sep

@newagemood 3 года назад

You can use Figma or Adobe XD :)

@Kucingseulgi 4 года назад

All animation with AE ?

@newagemood 4 года назад

Yeah, mostly using AE

@m-k3 2 года назад

خدعة بسيطة :)

@DeepakVashistha 4 года назад

Have you design these?

@newagemood 4 года назад

Yes i have on my past project.

@m-k3 2 года назад

Good

@newagemood 2 года назад

Thanks

@cecilialimxl5894 3 года назад

May I know what animation software you guys using for this interesting interaction? :)

@newagemood 3 года назад

You can use AE, Protopie Or Principle :)

@user-fo9ce3hr5h 3 года назад

which program they make these ui ? i'm so interested in.

@newagemood 3 года назад

You can use Figma, Adobe Xd or Sketch.

@user-fo9ce3hr5h 3 года назад

Tnx very much. i have another question. after we design these in adobe xd or ... , how can we use it in app or in website? we should code it but how we should code it? in which program?

@newagemood 3 года назад

@@user-fo9ce3hr5h im using flutter to develop app or web :)