PDA

View Full Version : Flat, but still Apple. (My Mockups)


kmj2318
Jun 3, 2013, 08:01 PM
Hi, I figured I'd throw in my mockups along with everyone else's as the anticipation for WWDC builds. I don't really see the UI looking like this, but wondered how they could go more flat, but still retaining a classically Apple aesthetic. They're unfinished (some buttons missing), but I think you get the idea. Myriad is Apple's font used for branding, but for some reason they never use it in their UI. Maybe this would integrate the whole package together even more, considering that the packaging and device itself are written in Myriad, so why not the UI? Also, I copied GoGa's idea for the settings icons, hopefully it's ok. :D

http://i2.photobucket.com/albums/y19/kmj2318/ios1_zps8ace7d36.jpg
http://i2.photobucket.com/albums/y19/kmj2318/ios2_zps1866a281.jpg

kmj2318
Jun 3, 2013, 08:12 PM
And here's another view of Messages with the keyboard active

http://i2.photobucket.com/albums/y19/kmj2318/mmm_zpsf1372201.jpg

Photobucket doesn't do good things to the image quality :/

ASKendrew
Jun 3, 2013, 08:18 PM
The messages mockup looks really good, especially the keyboard.

trekkie604
Jun 3, 2013, 08:19 PM
Interesting. There is very little distinction between the different apps which I'm not sure I like...

SnowLeopard2008
Jun 3, 2013, 08:23 PM
Looks nice. Flat != Windows 8 Modern "Metro" as many people seem to think. Flat is just little/no skeumorphism, shading, shadows, gradients, etc.

kmj2318
Jun 3, 2013, 08:33 PM
Here are closeups of the others

http://i2.photobucket.com/albums/y19/kmj2318/games_zps62a096c0.jpg



http://i2.photobucket.com/albums/y19/kmj2318/muu_zpsa020a9ed.jpg



http://i2.photobucket.com/albums/y19/kmj2318/sss_zps15751290.jpg

Telp
Jun 3, 2013, 08:35 PM
Certainly flat, and I like it a lot, but it almost seems a little Google-esque.

andrewpturko
Jun 3, 2013, 08:40 PM
Really good job on these, they all look relatively great. Although, relative is the key word, as I think they're too flat for Apple design. It's such a hard design to get right in what I think they're going to do, then again the key word there is 'think'..so we'll just have to wait and see. Speaking of key words, waiting is something that's next to impossible right now, I'm really looking forward to WWDC! :D

PedroDias
Jun 3, 2013, 08:47 PM
Great job, one of my favorite mockups up to now! Try making the icons on the settings app a little bigger, i think other then that everything looks fantastic!

Am3r1ca16
Jun 3, 2013, 08:55 PM
Please apple don't make iOS ugly and flat as people have been speculating

ZZ Bottom
Jun 3, 2013, 09:00 PM
Try to avoid the use of cyan as Microsoft has made a point to go heavy with it in Windows 8. Any designer with a sense of marketing would be wise to do so. Flat + cyan + gray =/= iOS 7.

Otherwise fun designs. I happen to think Apple would not go this drastic. Flat is very modern, but it also appears less classy. Apple no doubt will find a suitable medium.

ericp99
Jun 3, 2013, 09:33 PM
I like this design.

kmj2318
Jun 3, 2013, 09:51 PM
It's cool that people are liking the design. I basically attempted to adapt Apple's website into iOS :p

ra4oasis
Jun 4, 2013, 09:35 AM
Please apple don't make iOS ugly and flat as people have been speculating

Just for the record, flat and ugly are not mutually exclusive. Flat design can be beautiful and very well done. Flat also does not equal Windows 8.

apollo1444
Jun 4, 2013, 09:59 AM
I approve! good job, kind of how I imagine it will be

hafr
Jun 4, 2013, 10:10 AM
Just for the record, flat and ugly are not mutually exclusive.
What a weird reply to someone who pretty much said flat and ugly are the opposite of mutually exclusive ;)

cambookpro
Jun 4, 2013, 10:22 AM
I like it as a general concept, but none of the apps seem very distinct. I remember some rumour saying that there'd be coloured accents individual to each app -- implement that idea and it could be fantastic :)

5aga
Jun 4, 2013, 10:37 AM
I really like this concept. Make the keyboard darker or black and Im sold.

please make a Winterboard theme:D

kmj2318
Jun 4, 2013, 04:02 PM
I like it as a general concept, but none of the apps seem very distinct. I remember some rumour saying that there'd be coloured accents individual to each app -- implement that idea and it could be fantastic :)

I actually tried to do specific colors for each app, but it was really difficult to make work. But I do have another idea for that that I'll show soon. :)

I really like this concept. Make the keyboard darker or black and Im sold.

please make a Winterboard theme:D

If only I knew how.

monaarts
Jun 4, 2013, 04:12 PM
While this all looks great I think we will see slightly less white (think the white and gray switched in many places of your concept). However, I could see it looking much like this! Great job!

sdilley14
Jun 4, 2013, 04:54 PM
Nice, but too much white/empty space, and not enough distinction between apps. Still looks nice though!

pittpanthersfan
Jun 4, 2013, 05:19 PM
Nice job! The colors are great and it looks really clean.

derbyshire2013
Jun 4, 2013, 05:35 PM
Here are closeups of the others

Image (http://i2.photobucket.com/albums/y19/kmj2318/games_zps62a096c0.jpg)



Image (http://i2.photobucket.com/albums/y19/kmj2318/muu_zpsa020a9ed.jpg)



Image (http://i2.photobucket.com/albums/y19/kmj2318/sss_zps15751290.jpg)

I really like the Music app mock up, reminds me of Rdio and I think you've done a good job on all the pictures you've shared.

xcodeaddict
Jun 4, 2013, 07:56 PM
I don't like it, and I think your mock ups are TOO flat... like flat Coca Cola. If we wanted bland, we'd go to Android :p

If you think Apple are just going to copy/paste Google's new white & grey app look, maybe you don't know Apple very well.

portishead
Jun 4, 2013, 08:01 PM
As other said it looks quite nice, but a little too google. Not necessarily bad, just that Apple wants to differentiate.

I'm sick of everything so round and bubbly.

xcodeaddict
Jun 4, 2013, 08:06 PM
For everyone attempting to mind-read Jonathan Ive & Co's up and coming creations, may I suggest:

1/ You don't apply for a job with ANYTHING to do with UI/UX @ Apple

2/ If you ignore #1 (and even if you don't), read:

http://developer.apple.com/library/ios/#documentation/UserExperience/Conceptual/MobileHIG/Introduction/Introduction.html

Too much white with no discernable demarcation points/cues = no good. When they say "flat", they don't mean as white as snow and as flat as A4 paper, they mean "not so rounded".

famoussasjohn
Jun 4, 2013, 08:38 PM
Here are closeups of the others

Image (http://i2.photobucket.com/albums/y19/kmj2318/games_zps62a096c0.jpg)



Image (http://i2.photobucket.com/albums/y19/kmj2318/muu_zpsa020a9ed.jpg)



Image (http://i2.photobucket.com/albums/y19/kmj2318/sss_zps15751290.jpg)

I like it. Much better than what Forstall had to bring to the table lol.

pmontanarella
Jun 5, 2013, 04:15 AM
I really like them!

Great job!

Risco
Jun 5, 2013, 04:29 AM
Hi, I figured I'd throw in my mockups along with everyone else's as the anticipation for WWDC builds. I don't really see the UI looking like this, but wondered how they could go more flat, but still retaining a classically Apple aesthetic. They're unfinished (some buttons missing), but I think you get the idea. Myriad is Apple's font used for branding, but for some reason they never use it in their UI. Maybe this would integrate the whole package together even more, considering that the packaging and device itself are written in Myriad, so why not the UI? Also, I copied GoGa's idea for the settings icons, hopefully it's ok. :D



Fabulous stuff, it does however need a change. Apparently each core app will have it's own colour scheme. So say green for messaging, baby blue for mail. Could you do a new mockup with those colours?

satchmo
Jun 5, 2013, 08:36 AM
Are we getting too fixated in the whole look and feel of icons and dimension?
Yes, it needs a refresh (some might say an overhaul), but hopefully Apple will bring more features and functionality along with a re-skinning of the OS.

zhandri
Jun 5, 2013, 04:43 PM
love it

Mr. RPG
Jun 5, 2013, 04:45 PM
Great, but Apple's designs would have much more color, but this is certainly interesting.

ayeying
Jun 5, 2013, 05:52 PM
I like the Messages one. I think its because I text so much that having a nice looking messages view gives the phone it's luxury somehow.

seble
Jun 6, 2013, 05:58 AM
I don't like the music app because its the same non fucntional boring app, with just a new skin, but apart from that the rest looks great!

PajamaAstronaut
Jun 6, 2013, 09:34 AM
I'm a fan, especially of the messages mockup. Good stuff.

definitive
Jun 6, 2013, 11:13 AM
That's cool. I too am working on a flat design concept to submit to tons of Apple news sites. Since this is one of those threads, then I might as well share it here. So far I have the main home screen and FaceTime:

http://i.imgur.com/ESiHRV2.jpg

What do you guys think?

historyteacher
Jun 6, 2013, 11:15 AM
What font is the "2 of 24 recommendations" line? I love that clean crisp look! Awesome work. Thanks for sharing.

Definitive- your mockup is legendary! Thanks for the laugh.

sdilley14
Jun 6, 2013, 11:18 AM
That's cool. I too am working on a flat design concept to submit to tons of Apple news sites. Since this is one of those threads, then I might as well share it here. So far I have the main home screen and FaceTime:

Image (http://i.imgur.com/ESiHRV2.jpg)

What do you guys think?

Spot on IMO. Finally the change I have been waiting for!

roadbloc
Jun 6, 2013, 11:40 AM
Try to avoid the use of cyan as Microsoft has made a point to go heavy with it in Windows 8.

Not really. Unlike iOS, you can choose any default colour you want in Windows (and Windows Phone) 8. I chose Orange.

sk24iam
Jun 6, 2013, 11:51 AM
Very clean, I like it. Hopefully we will see something like this next week from Apple.

cambookpro
Jun 6, 2013, 11:55 AM
What font is the "2 of 24 recommendations" line? I love that clean crisp look! Awesome work. Thanks for sharing.

Definitive- your mockup is legendary! Thanks for the laugh.

Pretty sure the font is a version of Avenir, I think Avenir Light. Many iOS 7 concepts are using this, it's such a nice and crisp typeface!

GoCubsGo
Jun 6, 2013, 11:59 AM
Interesting. There is very little distinction between the different apps which I'm not sure I like...
Good thing it is just a mockup then, right?


OP, I really like the messages mockup. Well done.

ZZ Bottom
Jun 7, 2013, 11:36 AM
Not really. Unlike iOS, you can choose any default colour you want in Windows (and Windows Phone) 8. I chose Orange.

I'm referring to the heavy use of these colors in marketing material.

jclardy
Jun 9, 2013, 04:15 PM
Looks okay, but those toolbar buttons are definitely too short for Apple's human interface guidelines. 44x44pt minimum.

superstarmc
Jun 9, 2013, 04:44 PM
I'm still confused as to what is meant by a flat design.