flat-ui-login-iphone-1

flat-ui-login-iphone-2

Login Templates

Here is a first UI pattern that we have for you. Login screens are common in most apps. Here are the login screen designs that are included in this pack of Flat UI templates.

$19

Or Get A Sample



User Profile Templates

User profiles are also one of the most common screens in Social networking apps. When you give a user an opportunity to login to your app, you should be able to display information about the user’s profile. Here are some minimal UI user profile designs that will make your app pop

flat-ui-profile-iphone-1

flat-ui-profile-iphone-2

$19

Or Get A Sample



Activity Feed templates

Are you looking to display an activity feed or stream in your app? Here are the designs included in the pack

flat-ui-feed-iphone-1

flat-ui-feed-iphone-2

$19

Or Get A Sample



Settings Screen

You asked for it in the comments so I decided to add this one in. These are some flat designs for a settings screen

flat-design-settings-iphone-1

$19

Or Get A Sample



What screens would you like to see included?

At the moment, we are adding more screens and UI patterns to the pack. But I want to make sure the screens you care about are included in the pack. Please leave a comment and let me know these two things 1) What do you like about this? Is this something you would want? 2) What kind of UI patterns would you like to see included in the pack?

Please leave a comment below and answer those two questions. I will really appreciate it. Thanks





168 Responses to “iPhone Flat Design UI Patterns”

  1. Bernhard says:

    1) Everything! They look amazing, thanks for sharing.
    2) What I would like to see is a searchscreen and a settings screen.

    best regards

    #
    • Tope says:

      Thanks, Bernhard. A settings screen does sound like a good idea. Glad you like it!

      #
  2. Marc Watson says:

    Flat… yuck! Flat, to me, has no creativity. We don’t live in a flat world! It takes talent to make things appear that they are on different planes and float on the screen. Maybe that is why someone has it in their mind that “flat” is new “black”! Anyone can do flat and pull it off! The trick is to use transparency and shadows that pull things off the surface!

    #
    • Tope says:

      Hey Marc, sure it isn’t for everyone. I resisted it for a while too but after seeing Google new designs in their iOS apps, I think it might have legs..

      Sometimes minimal is better. You can have a designer showing off his talent by using drop shadows but if you can communicate the message better with less gloss, why not?

      #
    • Jeff says:

      You do not get the Flat design trend. The idea is to feature the content of the site instead of your design ego! Anyone can not pull off Flat design!

      #
    • john haden says:

      Everyone is entitled to there opinion, but I think flat & creativity are completely un related. To me the “trick” is to make an app intuitive and easy to use with as few screens as possible. Whether my button is leather or a flat rectangle, it’s the “creativity” of developing a useful app that I’m most concerned with. Agreed that it takes enormous talent “to make things appear that they are on different planes and float on the screen” But now with the time saving of flat design, perhaps designer can spend more time on creating intuitive ways to use the app instead of worry about the depth perception of a leather bound book icon.

      Flat, like any design trend, will have its two seconds of fame ’till something better comes along, but I for one am tired of leather, wood and water drops and look forward to a flat world. Yay minimalism :)

      #
    • Matt says:

      I checked out your work on your website Marc and it’s pretty awful, honestly it is bad. What do they say about people who live in glass houses again?

      #
    • Kim says:

      There might be talent involved in making things appear as they float on the screen, but much more talent is needed to make most people feel good about the product they use.

      In my opinion, you’re a terrible designer. The things you create are absolutely horrible. I believe the majority of user find the apps you’ve created ugly(I might be mistaken, but I believe not). If it’s true that everyone can pull off flat design(I don’t believe that’s true, though) then you should seriously consider changing your design language to flat. No attack, just (strongly worded, I admit) criticism.

      Or hire Tope, who’s apparently an excellent designer.

      #
  3. Ignacio says:

    Hi! great idea!
    I like flat design. What about adding some lists and different cell styles. Also it would be great if you can suggest a couple of icons sets to go with the new design.
    Bye thanks!

    #
  4. bstone says:

    I like it. I disagree with Marc Watson. All of the rounded bubbly stuff reminds me of the Photoshop 5 era when people made everything with drop shadows and bevels. I like this clean approach.

    #
    • Tope says:

      Yep, Flat design as I said above, is not for everyone…. Good to see there are people on both sides because on App Design Vault we cater to people across the spectrum from Flat all the way to Skeuomorphic :-)

      #
  5. Pavan says:

    Looks great,
    I would vote for all, but given preference
    In terms of Decreasing priority Feed , Profile & Login.

    #
  6. rramnel says:

    Very nice! Would definitely like to see a flat sidebar and some flat icons as well.

    #
    • Tope says:

      Thanks :-)

      #
  7. GM says:

    I disagree with both marc Watson and bstone (whoah, what a rebel I am)…

    To me, the problem is that after an era where “[everyone] made everything with drop shadows and bevels”nwe’re getting in an era where “[everyone] makes flat UIs”. Flat or not flat is not the matter, it’s the uniformity and conformity that makes it boring.

    Quality designs, flat or not, will stay good (such as those proposed by Tope).

    #
    • Tope says:

      Well said. It is like how fashion goes in circles. People start wearing what was fashionable in the 80s etc…

      The best way is to stay current, know what’s out there but… don’t be afraid to be different and stand out

      #
  8. Dave Baxter says:

    Hi,

    I like it, looks very user friendly, no clutter.

    Can’t wait till I can get it.

    Dave

    #
    • Tope says:

      Soon, Dave, very soon…

      #
  9. Christina says:

    Useful design is more important than bells, whistles and fancy smanchy images. Design should never distract from any task that needs to be accomplished.

    #
    • Tope says:

      Well said, Christina.!

      #
  10. Joe says:

    I like it, yes I can get use out of it and second I would like to see tab bars, settings screen, and possibly iPad versions of the same. That is just my thoughts you should obviously do what works best for you. Thanks for sharing the sneek peek.

    #
    • Tope says:

      Thanks… A settings screen seems like a good idea. That’s a second vote for that.

      #
  11. weigo says:

    Looks great.
    I’d like to have the following screens:
    + Activity Feed with “timeline design” like in your latest template
    + Map screen
    + Menu screen (Facebook/Path sidebar)
    + Settings screen
    + Detail screen
    + Statistics screen
    + Empty data screen
    + Walkthrough screen (to help the user when the app is used for the first time)
    + About screen
    + Search screen
    + Splash screen
    + Share screen

    Would be great to see at least some of them in your pack.

    #
    • Radius says:

      Totally agree with weigo, be great to see handful of screens mentioned. Overall love what you’re doing, keep up good work and we’d love to keep buying templates!

      #
    • Tope says:

      LOL, Bjoern, You don’t ask for too much, eh :-)

      I can’t promise all those screens but good to know what can be included

      #
      • Radius says:

        Just as follow up, for us, if had to refine choices would like to see following -

        * Settings screen
        * Share screen
        * Map screen

        Really do love your work though, and not being design oriented, hope you can help guide our future interfaces. Seriously looking forward to this pack.

        #
    • Mazen says:

      The design looks smart, I like and I would love to see walk through screen… Thanks a lot

      #
  12. Jeff says:

    Looks great Tope!

    #
    • Tope says:

      Thanks :-)

      #
  13. Philippe says:

    Hi,

    Like each time, you provide something useful, ans beautiful, thanks!
    1) this is really nice, I do think of possible use in my app for each of the components presented above.
    2) what would be cool : pins for Map !

    Great job.

    #
    • Tope says:

      Thanks for the kind words, Philippe. Good idea about the Maps pins

      #
  14. Nate says:

    Great work. I am working on a Flat design as well, it is focused on ease of use buttons and simple color schemes. The one thing I am struggling with is lists and how to make them more functional yet simple and elegant. I would love to see what you are planning for product list types!
    Blendedmarket

    #
  15. Michael says:

    To me the “flat” designs (google/android included) look like web pages. Some are good (like the profile designs above), and some are boring (like the login designs above). I am not a minimalist. I like “pretty” designs because my esthetic goes that way. I like textured walls in my house not a flat paint job. I like houses with siding not flat stucco. I like “art” rather than just “function”.

    As to screens, I would love to see your take on a dashboard type screen showing key company indicators, financial summary, that kind of thing.

    #
  16. Bilal S. Sayed Ahmad says:

    Looks great! I would wonder what you would think a Flat Music player would look like. I see the argument that Flat Design can be just as beautiful as Skeuomorphic but I wonder if there are areas where Flat just wont cut it.

    #
  17. Ricardo says:

    1) Love them all! Amazing work, Tope!!
    2) It would be great to have some additional settings and detail screens. And maybe a cool sidebar screen, please?

    Great job, congrats

    #
  18. Kevin says:

    I like. And I like the general trend. I’m also partial to what seems a modified approach to Flat design that includes subtle contrasts with compatible colors. Like these icons: http://www.graphicsfuel.com/2013/04/20-flat-icons-psd/

    I’d love to see you take on more tables and a settings screen.

    #
  19. Andrea says:

    Great stuff!

    I love the green and red login layout (not necessarily the colours). I would try with a different font on the other screens…

    Nowadays I feel like a “share” screen is a must have. I particularly like those were the message is at the top and then you can enable/disable different social network to which the message will be posted. Pic Collage has one of the nicest implementation that I’ve seen so far.

    Also I can’t see any Tabbar navigation in the comps shared so far…

    I think most of the basic UI elements should be covered so to give developers the ability to re-arrange the layout for any specific need.

    Also an UIAlertview example would be really useful.

    BTW… Thank you very much for doing this for us! :)

    #
  20. Kev says:

    It looks great Tope, but I think the Flat Design is a trend that wont be fashionable in a couple of cycles, so maybe when it is no longer fashionable, you could sell an upgrade that migrates the app design to the design that’s fashionable then.

    #
  21. john haden says:

    Love this Tope !

    I think the thing I dig most about flat is that it’s good for both iOS and Android, and hell… obliviously windows (if we ever get a request to build an app :)

    The second thing I dig about Flat is it almost “forces” you to think simple. It’s like… why have such a clean button, and yet make the UI cluttered and confusing?

    Again… I subscribe to a ton of services, but Tope, AppDesignVault is one of the most valuable!

    #
  22. Richie says:

    Wow!. Grat job. I really appreciate it.

    I like flat design but I’d not like that EVERYTHING becomes flat since now. Diversity, please. The only thing that matters is the app looks awesome.

    I vote for a settings screen too. A side panel will be great as well.

    Thank you very much, Tope.

    #
  23. Ago says:

    Thanks Tope this is really great work your doing, love what your doing.
    I feel it would be nice f we could see a chat and messaging screen also

    #
  24. Incyc says:

    Looks great and free? Can’t ask for more than that. On the side of what I’d use, a Settings page would be nice.

    #
    • Incyc says:

      And thanks for the time to do this

      #
  25. PKCLsoft says:

    One thing that would be cool is a screen for parents in kids apps. Take the “parent zone” screen in “Blocks Rock” as an example. As a kids edu developer this would be brilliant to get a slick new flat design.

    #
  26. François says:

    Dear Tope,

    Thanks for your great work! I love what you do because my photoshop skills are really bad. therefore I would also enjoy if you would do a sidebar flat design. And maybe some flat icons : Facebook, Twitter, Map, Camera, Music… Thanks!

    François

    #
  27. Beckmania says:

    These are fantastic. Really great. I’d love to see a screen showing a list of people/contacts…..and perhaps a screen used for settings/preferences! Thanks!!!

    #
  28. Wunna Min Aung says:

    WOW !.
    Thanks for sharing.
    Go on Tope.

    #
  29. Urkman says:

    I would like to see:
    – Sidebar Menu
    – Tabbar
    – Searchbar
    – Toolbar

    Thats all;)

    #
    • Rudá Cunha says:

      Really, all the basic controls

      #
  30. Wayne Liu says:

    All of these templates look great. Although I personally don’t quite like flat designs, I can still give you some small suggestions:
    * focus more on colors using in a template. Try to find out what colors look great when adding together.
    * Although high-saturation colors attract American users, be aware that lower saturation (and lighter) colors attract asian people more (especially Japanese users)
    * don’t force yourself to crate flat design templates just because people say “flat design is getting more and more popular”. Sometimes, people like this design just because OTHER people say it’s popular. They may not really like it. If you think adding a small amount of gradient or drop shadow (or reflection shadow) could make it better, go ahead to do it.

    #
  31. matthew hui says:

    Looks good. What about a blog type style with a main post and comments underneath?

    #
  32. Jeremy Race says:

    These look great, Tope. Really fond of the user profile views and activity feeds.

    Few minor tweaks I would make:

    * In the feed view, the settings icon are dark and so is the background; this can make it difficult to see or distinguish. I think it’s too easy to miss, and should have a bit more contrast to make it more visible. I think this affects the First (Black) and Third (Purple) feed views the most.

    * I’m not really a fan of the green text on white for the last profile view, but that could just be me… I understand the theme of that is mean’t to be green-ish, but I still feel it’s a bit off. Design is subjective, of course, so likely just my preference.

    * In the last login template (purple), I would actually make the “Forgot Password” background white to give it more contrast.

    #
  33. Tudor says:

    Congratulations for the initiative! You could add articles/news (not everyone wants a social media app), calculator, calendar, checkins, coach marks/ tutorials, comments, friends import dialogues, maps, popovers, search, settings, share on social networks, feature walkthroughs.

    #
  34. emichaud@gmail.com says:

    Hey Tope,
    great job as always. Looking forward to see the final product as well as the new design for June.

    I really like the red login and user profile views they are very clean and nice. I agree with @jon haden’s comments about making an app intuitive and easy to use is the most important. That said, things can get boring after awhile and it’s nice to see clever but clean UI updates to apps.

    @Wayn Liu’s advice on color choices is terrific and one of the reasons I especially appreciate all your talent and work to provide us with a great library of designs, color schemes and useful libraries to turn to when we need a creative boost.

    It’s challenging enough at times to make an app “work good” so all the help you provide us to make it “look good” as well is just awesome.
    best of luck!
    Ev

    #
  35. hamif says:

    hello is very nice intreface. how to download it ??

    #
  36. Luiz says:

    Great design! I appreciate it.
    The only thing I would change is the icon letter on the login template. Look distorted.
    Thank you very much, Tope.

    #
  37. Scott Jann says:

    Nice work! How about a tab bar that fits in with the design?

    #
  38. Stephan Pulver says:

    I love the ‘User Profile Templates’ – and how about ‘Search templates’?

    #
  39. Max Xu says:

    Input fields would be nice to have. Great design!

    #
  40. Srinivas says:

    Great work Tope. All the designs are very good, i like feed activity layouts most. Looking forward for the final templates.
    Like someone else pointed already, flat version of alert view would be wonderful addition to the pack.

    Thanks again and keep up the good work.

    #
  41. Helena says:

    I love it. I think simple is better. It can be nice and still simple. Thanks for all you do for us. Every little bit of help I get is appreciated.

    #
  42. Richard says:

    No matter which side of the fence you stand of “For or Against” your designs here are as usual, great looking stuff, and will be a great pack to add to Bat Utility belt. I have alway been of the opinion that Flat Design was introduced to us by Microsoft and Google. I think because that don’t understand curves. How about a Flat Designed Stop Watch I spoke about in London!

    #
  43. Captain Gene says:

    Looks awesome to me. I’m a simple man – I like concrete better than abstract. I think this flat screen method lends itself more to concrete. Thanks

    #
  44. Neel says:

    1) great job…!!!
    2) setting, gallery , dash board chat screens.

    #
  45. Christer says:

    The flat designs are awesome!

    What to be included,

    How about implementing / setting up an re-designed SDK of the Google Plot?
    http://www.raywenderlich.com/13269/how-to-draw-graphs-with-core-plot-part-1

    - This Statistics view is ugly when it comes right out of the box! Getting a “flat design look” on these, as well as matching colors for the apps you create would be great!

    Other then that it would be nice if you could include some icon packs in the designs you create (overall) – Because we, or atleast me, buy your templates because i have no usefull photoshop skills! I bet you can make a deal with the provider of you icons!

    And another thing! it would be nice if you could setup a text file or pdf – Displaying what the exact color codes of the different stuff is. Just in-case we need to change something or add something – and want it to be the same look and feel as the rest of the template!

    Other then that i just have a comment about an earlier post, listing alot of screens!

    + Map screen
    - Yes, if you dont have the possibility to provide us with the icon sets so we can create one ourself.
    + Menu screen (Facebook/Path sidebar)
    - Yes
    + Settings screen
    - Absolutely
    + Detail screen
    - Detail screen can mean alot, in my opinion you are already doing this.
    + Statistics screen
    - As suggested by me too, and a way of doing it.
    + Empty data screen
    - Just a blank screen?
    + Walkthrough screen (to help the user when the app is used for the first time)
    - Screens like this is actually not screens – Its screenshots of the screens that your application has! Just UIImages loaded into a library form.

    + About screen
    - Usually this is just a screen with your logo and what you do! So i dont see the need for it.
    + Search screen
    - Search screen would be nice!
    + Splash screen
    - Splash screens are the applications screen when you start it up, and usually represents the individual application name. I believe it would be a bad habbit into generalizing this – As the first impression of an application would be the exact same. And its just a picture!

    #
  46. Alexis says:

    News Activity Feed with a SliceShow Photos in the top

    #
  47. Jackson Harper says:

    Looks great, definitely something I would use. I would like to see a Tab bar controller

    #
    • Eldar says:

      I would love to see Tab Bar as well.
      And Navigation Bar

      #
  48. John says:

    Tope,
    Beautiful work as always.
    May I suggest as others have suggested
    - Settings
    - Map
    - Splash screen
    - App introduction screen

    also image Collection views for both iPhone and iPad

    Thank you for your consideration

    #
  49. John says:

    One more thing

    user defined customization of colors.
    Allow the user to choose color of background and text color via a settings color chooser panel. This would allow for more ‘localized’ sales as mentioned by Wayne Liu regarding colors for different users based on their location.

    Thanks again

    #
  50. Sergey says:

    flat design is interesting, but in order to meet the needs bright IOS7 buttons (yellow, red)

    #
  51. Sergey says:

    how to download this package??

    #
  52. Brian says:

    I look at ‘flat’ as ‘not having fake 3d shading’. Its a clean and neutral starting point. I like the look of designs that start with something like this and add something subtle (pattern, slight gradient, another shape or line). With the flashy rounded, glossy, or beveled designs it takes more dramatic additions to be noticed, but a ‘flat’ base lets subtle stand out.

    #
  53. Fulvio says:

    Tope,
    Really beautiful work.
    This is my list:
    1 Settings screen
    2 About screen
    3 Splash screen
    4 Sidebar Menu

    #
  54. Annette says:

    Looks goood! This can be useful! I would like to se tab bar, a design for collapsing table with headers and sub headers and a design for adding a text entry.

    #
  55. Ahmed says:

    Does anyone know how I can download these templates ? Thank you !

    #
  56. phillip says:

    As always, nice work!

    How do you think the flat UI design will impact mapping colors and presentation?

    #
  57. Adam Dahan says:

    Where is the download for these ?

    #
  58. Alex Leiva says:

    Man you’re amazing!
    It’s so kind of you to share, thank you very much!

    #
  59. Wesner Moise says:

    I don’t think that Apple is actually going flat.
    I think that iOS7 is going full 3D and that gloss and shadows are going to be automatically rendered using the new SceneKit api.
    Every other iOS user interface patent involves 3D for the past four years.

    #
  60. Gonzalo says:

    What about having the option to see the Images in a Grid like in Instagram and other photo sharing Apps.

    Thanks

    #
  61. Jacob says:

    1) Everything, I think that theses templates look great!

    2) I think you should add a menu!

    Anyways thanks a lot, and how do I download it?

    #
  62. breakeva says:

    Excellent, i love it
    Photo album screen :D

    #
  63. Kalai says:

    Great idea. Like to see in Action!

    #
  64. mapemaew says:

    This is awesome.

    #
  65. mapemaew says:

    - adding comment screen would be more awesome.

    #
  66. whitneyapps says:

    Very cool!

    I’d love to see

    - Settings screen
    - About screen (maybe with a web view – ideally with a CSS file so the web content matches the template :-)
    - Input fields / input form
    - Sidebar Menu

    Thanks for all the awesomeness!

    Steve

    #
  67. Rodger says:

    Designs are great! I really like the flat look!
    Cant wait to get it!

    #
  68. Saif says:

    Woow! I love that! Flat desgin is really a nice thing cuz it looks much cleaner, simple and not oversized!!

    I would also love to see flat desgined buttons, Table(cells) and as mentioned before a settings screen is a nice idea.

    Cant wait!!

    #
    • Saif says:

      What i really really need.. i would pay for, a really nice designed flat Chatview.. with “Bubbles”, time dividers(like for each day a header section) and input and send field/buttons. maybe a view that gives option to send other options. like place or contact..

      You get a kiss from me :)

      #
  69. dreampowder says:

    i’d really love to see a “side menu” with section headers/footers and cells

    #
  70. Durga says:

    They look amazing. Cant wait to try these on my app. Will there be a flat template for Sports apps like the one by Nike+ etc

    #
  71. Ray says:

    I think a lots of “flat” designed GUI elements have a very, very slight blend of gradient upon them. That way, they look flat, but are still more charming than without.

    I like your templates – good direction. Thanks!

    #
  72. Bilal S. Sayed Ahmad says:

    So after looking at your designs on this page I got inspired to attempt at designing something flat. After hours of work here is what I came up with: http://tinypic.com/r/2ufaexg/5

    Considering I am a developer with no Design experience I think it turned out okay except I forgot to make assets for the actual button. >_<*

    #
  73. northy179 says:

    Tope, everything you do impresses me.

    Shut up and take my money!

    #
  74. Ashley says:

    Love this (and all of your work)! Can’t wait to see the final product!

    #
  75. Sherwin Techico says:

    Good job Tope. Can’t wait to get some of these. Would serve as a good starting point. Thanks in advance.

    #
  76. Yasmin says:

    Hi,
    As always, you’re ahead of things :)
    I think flat design is a tough one to crack since it’s very easy to be boring and dull and… flat.
    I think that a WOW flat design would have to do with a perfect color blend.
    The first three login screens still have tiny round corners, so that’s not going all the way. I like the green colors (but, as I said I’d square the corners) and I really like the purple. It has more depth to it.
    The third user profile is very impressive in the less-is-more sense. The red wine color is also elegant.
    The activity feeds show the complexity – in my opinion the first two are not special, but the second pair is impressive.
    I’d also like to see an iPad screen with lists and buttons or a dashboard since I think it’s not about one screen or the other, it’s about making the UI elements work together and on a bigger screen you can get a better sense of the big picture.

    Thanks for the great work you’re doing,
    Yasmin

    #
  77. JoeFryer says:

    Good work Tope, some of these look great. I’m excited to see what else you’ve got!

    #
  78. weigo says:

    1) What do you like about this? Is this something you would want?
    Definitely!. I think that Flat Design is only a option and I do not see all upcoming apps have a flat design, even when Apple might go this way in the future. So it depends on the app context. But there are so many beautiful apps using flat design and I see for my upcoming apps flat design as a perfect match.

    2) What kind of UI patterns would you like to see included in the pack?
    I’ve already posted my wishlist above :-p
    But let me pick at least my most wanted screens:
    + Map screen (with flat pins e.g. for different POI)
    + Statistics screen (with flat stats)
    + Share screen (with flat social media icons)

    #
  79. François says:

    Thanks!

    #
  80. hamid says:

    hi it’s very nice gift for developper

    thank you very match
    i love appdesign

    #
  81. Jeremy says:

    Thanks again Tope! Wonderful as always!

    #
  82. Gary says:

    You did a great job! Amazing designs! Thanks a lot Tope!

    #
  83. Matthew says:

    The templates do look good, but I’m not a fan of the trend. I think people are interested because it is different, but I think that a flat UI is less intuitive. It’s popular with the hipster-tech-nerds, but I think the average person will sometimes struggle to know what on the screen is a button, and what is just a coloured area. I think that after a year we’ll be back to the old standard that have developed over the last 20 years. Maybe a little flatter, but not totally flat. I see this trend being a bit like the thin neckties of the 80, we eventually went back to a pretty standard tie size and that has stuck through to today.

    I think that some app developers are going to see an increase in support costs with a totally flat UI. Apple’s HIG says that a button should look like a button so that people intuitively know it’s a button (or something to that effect) and a flat rectangle does not look like a button.

    #
  84. Bartley says:

    This is the first time in my ADC history where we are headed to the annual conference and we are already discussing iOS 7 with a ripped off clone of Windows UI icons and their Windows 8 sliding tiles. Typically, it’s Microsoft ripping off the Apple UI. Now we’re doing it to Microsoft. I can see why. The sliding tiles UI is clean. Minimal and simple. With Twitter Bootstrap’s pure CSS UI, we can now start looking at a while new range of interface variations and graphics, buttons that no longer need to be cut in photoshop as JPEG, GIF or PNG anymore. Twitter Bootstrap and UI inspirations like these are going to pave the way for alternatives in interface use and design.

    I love Tope for having the creative “genius,” to do this way in advance of what we’re going to be seeing at ADC next week. You are brilliant and a few of us senior ADC developers salute you.

    – bart

    #
  85. cenob8 says:

    Much appreciated ! Great work.

    #
  86. walex says:

    WOW awesome Tope

    #
  87. Priscilla says:

    Looks great! Thanks!

    #
  88. devia@163.com says:

    So good, done a great job.

    #
  89. wear says:

    Great work

    #
  90. Tim Chen says:

    Great works!
    To a junior designer like me, it’s really a good chance to learn from these templates.
    Thanks man

    #
  91. Gianni says:

    Sorry but i am not agree about Skeuomorphism is an old school, flat it is a back to early 2000 web design and it show poor immagination and creativity and iOS don’t need to copy Android style.
    But comment apart great works as usual Tope!

    #
  92. Wolfgang says:

    For me it’s not important if it is flat design or skeuomorphic or something else as long as it looks and feels great and as long as the design helps to make an app work.

    Besides that: Tope you did an amazing job (again)! Thanks.

    #
  93. Morten says:

    The flat design looks ok.
    But it gets wery “Windows phone 8″ ish.
    Let Microsoft have their Flat design by them selfe.
    I do like the “normal” Iphone design and all my apps on my iphone should have that look and feel.

    #
  94. Mustafa says:

    The concept of a ratter “flat” design seems to apply beautifully. Thanks again, Tope!

    #
  95. Mustafa says:

    Another interesting aspect with such simple designs is that as an app designer, you get to keep one unified look and feel for your app if you ever feel the need to target a wider audience (having to use the same design on different mobile platforms e.g. Win Phone 8, Android, …).

    #
  96. Bill says:

    Can you please host this publicly on github so that people may extend this work?

    Also there is a slight bug, on controllers that customize the UINavBar the navbar is not updated on the first call.
    This is because viewDidLoad is too late to put the NavBar customization – it does work if you put the customization in awake from nib on the first time. Unfortunately its kind of a catch 22 because UINavBar customization should not be in view controller code at all.

    #
  97. Akshay says:

    Quoting Steve Jobs,
    “Design is not just what it looks like and feels like. Design is how it works.”

    In the end, it’s all for the end user. The end user should not require to learn the design. It should be fluid.
    If it’s intuitive enough, flat or not, it’s a good design!

    #
  98. Kevin says:

    This sneek-peek comes right in time, as Apple now has released beta for iOS7, love it..

    #
  99. NARAYAN TAVILDAR says:

    Tope,

    Looks great. When are you releasing flat version of all UI controls? Now that iOS 7 preview is released, I am now reluctant to build new app using templates. Along with each template, if you could release some generic most used icons to match the theme would be better.

    #
  100. Jey says:

    Skeuomorphism is an ultimate design.apple have done the universal ultimate design in older iOS. i don’t know why they have back to the old flat design in iOS7. may be this is going to be the fall of apple.

    #
  101. Marcelo says:

    Love it Tope!
    Keep up the good work

    #
  102. Morten says:

    Now I have downloaded it and tried it in the simulate.
    Very nice work you have done here.
    I don’t know how fond I am of the new IOS7 design. But you have really done a very good job here.

    Best regards,
    Morten

    #
  103. Shubham says:

    Awesome Designs…Really loved all of them

    Keep up the good work tope.. :)

    #
  104. Eldar says:

    Amazing! I absolutely love it!
    However, I’m having trouble with the license. At https://www.cocoacontrols.com/controls/iphone-flat-design-ui it says MIT License, but I can’t find any reference to this on this page. Are the packs listed on this page are Free or Open-Sourced and can be used in my App?

    Thank you.

    #
  105. Rudá Cunha says:

    Sidebar with sections (groups);
    All controls ios (toolbar);
    Login screen (with facebook);
    Possible using the UIAppearance.

    #
  106. Wang says:

    I’m really love it ,so beautiful..thinks for you….

    #
  107. Shyam says:

    Thanks man.. Your the best.. You must be the tutorial team guy from Raywenderlich.. Great stuff…

    #
  108. Seth says:

    Would be great for a messages screen:)

    #
  109. satheesh says:

    Really awesome!!!!!!!! It’s very help for the learner keep updating the new templete

    Thanks,
    Satheesh.k

    #
  110. Jay Chulani says:

    Looks great Tope!

    #
  111. Paul says:

    It’s kind of ironic that as much as we scoff at the bells and whistles of the late 90s, early aughts era aka Era of the Flash Gif, some of us scoff at simple, easy to understand/use, non-migraine inducing examples of user interface like the ones presented in this post. I’m down with the flat, flashy drop shadows and fancy gradients be damned.

    #
  112. Senthil says:

    Looks great..

    #
  113. Brett says:

    Maybe I am missing something but where are the actual design templates in these packs? In definitely looks like when you download a “pack” that the flat UI vector files would be included. Is this just a code template or why am I not seeing the vector files?

    Need the vector files for these designs, for sure.

    #
    • Tope says:

      Hi Brett, Yes, this is a code template. Most of the design was generated in Objective C

      #
  114. Manish says:

    Wow!. Grat job. I really appreciate it.

    #
  115. Jurij says:

    Dear Guys,

    thank you for great templates!

    regards, J

    #
  116. Rangga says:

    Looks like good for the flat design, but i want to ask to you. Whether the sidebar is always hidden in the menu?
    Difference with responsive website, the sidebar usually show on the bottom after the content.
    Thanks

    #
  117. Kanad says:

    Greta work!!! Really helped me a lot!!! :)

    #
  118. Sharat says:

    This is fantastic and so useful. Thanks for providing this! An amazing resource.

    #

Trackbacks/Pingbacks

  1. iOSのフラットデザインUIパターン | MOONGIFTメモ -

    [...] iOS Flat Design UI Patterns – Download Now | iPhone and iOS App UI Design Templates. [...]

  2. 開発リソース:最新iPhoneフラットUIデザインテンプレート無料ダウンロード | iOS開発者@日本 -

    [...] ダウンロードURL:http://www.appdesignvault.com/iphone-flat-ui-design-patterns/ [...]

  3. Application UI Design: iOS 7′mageddon | The Official Blog of Paul-E-C Designs -

    [...] The well hyped iOS 7 user interface design has basically put the anticipation of the Messiah’s return on hold. Despite all the hype, good ol’flat app ui design wins with me every time. Check out the simple designs of this talented cat! [...]

  4. Mobile Design Patterns | UX WIKI -

    [...] iPhone-flat-ui-design-patterns [...]

  5. The ultimate guide to flat design « Refined Sites Blog -

    [...] styles of downloadables: logins, user profiles, activity feed, settings and sidebar design. The downloadable templates come with everything you need to get started and allow for full customization of each [...]

  6. The ultimate guide to flat design | WordPress Coders - Articles -

    [...] styles of downloadables: logins, user profiles, activity feed, settings and sidebar design. The downloadable templates come with everything you need to get started and allow for full customization of each [...]

  7. The ultimate guide to flat design - Articles in IT and more | Articles in IT and more -

    [...] styles of downloadables: logins, user profiles, activity feed, settings and sidebar design. The downloadable templates come with everything you need to get started and allow for full customization of each [...]

  8. The ultimate guide to flat design | AsterHost -

    [...] logins, user profiles, activity feed, settings and sidebar design. The downloadable templates come with everything you need to get [...]

  9. The ultimate guide to flat design | Spicer Designs – Web Design, Technology and News -

    [...] styles of downloadables: logins, user profiles, activity feed, settings and sidebar design. The downloadable templates come with everything you need to get started and allow for full customization of each [...]

  10. 怒赞!2013扁平化设计终极指南 -

    [...] iPhone flat design UI template (free)有着多种多样的扁平化风格iPhone模板,适用于应用界面设计。提供了你所需要的一切,包括:登录界面、用户个人资料、设置、滑动栏、活动窗口等。 [...]

  11. 2013扁平化设计终极神器——扁平化资源大集合 | 一周一博 -

    [...] iPhone flat design UI template (free)有着多种多样的扁平化风格iPhone模板,适用于应用界面设计。提供了你所需要的一切,包括:登录界面、用户个人资料、设置、滑动栏、活动窗口等。 [...]

  12. 设计宝典:2013扁平化设计终极指南 - 电商中国 -

    [...] iPhone flat design UI template (free) iPhone flat design UI template (free)有着多种多样的扁平化风格iPhone模板,适用于应用界面设计。提供了你所需要的一切,包括:登录界面、用户个人资料、设置、滑动栏、活动窗口等。 [...]

  13. The ultimate guide to flat designPower of HTML | Power of HTML -

    [...] styles of downloadables: logins, user profiles, activity feed, settings and sidebar design. The downloadable templates come with everything you need to get started and allow for full customization of each [...]

  14. iOS开发资源:KFCocoaPodsPlugin、XLRemoteImageView以及JASidePanels等 | Ethan's Web Site -

    [...] Flat Design UI:一组免费的、扁平化iOS UI设计模板, 项目地址   http://www.appdesignvault.com/iphone-flat-ui-design-patterns/#a_aid=mdev [...]

  15. App Showdown 3: Better Than Babies, One Hand Poker, and Where Should I go? -

    [...] Free Pack of Flat UI Designs on App Design Vault [...]

  16. Wize Designs web design TN | adobe tutorial, TN | website design, USA -

    [...] iPhone Flat Design UI Templates [...]

  17. Free Resources for Creating a Flat Design | Search Engine Optimization & Internet Marketing (SEO & SEM) Blog -

    [...] iPhone Flat Design UI Templates [...]

  18. Free Resources for Creating a Flat Design | Photo Vide -

    [...] iPhone Flat Design UI Templates [...]

  19. 怒赞!2013扁平化设计终极指南 « PM百科 -

    [...] iPhone flat design UI template (free)有着多种多样的扁平化风格iPhone模板,适用于应用界面设计。提供了你所需要的一切,包括:登录界面、用户个人资料、设置、滑动栏、活动窗口等。 [...]

  20. iPhone Flat Design UI – Stay on the… | Changelogs -

    [...] http://www.appdesignvault.com/iphone-flat-ui-design-patterns/?utm_source=feedly [...]

  21. 怒赞!扁平化设计终极指南 – 精品代码jphtml.com -

    [...] iPhone flat design UI template (free)有着多种多样的扁平化风格iPhone模板,适用于应用界面设计。提供了你所需要的一切,包括:登录界面、用户个人资料、设置、滑动栏、活动窗口等。 [...]

  22. 扁平化设计神器—扁平化资源大集合 - UI范儿 -

    [...] iPhone flat design UI template (free)有着多种多样的扁平化风格iPhone模板,适用于应用界面设计。提供了你所需要的一切,包括:登录界面、用户个人资料、设置、滑动栏、活动窗口等。 [...]

  23. Free Resources for Creating a Flat Design -

    [...] iPhone Flat Design UI Templates [...]