1 Attachment

109 Responses (page 1 of 5)

  1. Louie Mantia Louie Mantia

    I imagine iOS 7 gets a bit more than a makeover, but I don't see a reason for it to get much more than this, honestly.

    View full version here.

    Things I've changed/updated...

    Font: Avenir. Helvetica is beautiful, but can appear clunky. Avenir is friendlier and seems like a good step forward.

    Navigation Bar: Light, almost like the iPad navigation bars. More rounded corners. Beveling on the "Settings" label.

    Background: No pinstripes, just a clean slate gray color.

    Grouped Table Views: Less rounded corners, slight beveling (like introduced lately in iOS) and minor separator-meets-the-edge fixes.

    Icons: Tweaked to be consistently weighted and colored differently. Blue are radio frequencies. Navy for Notifications. Gray for audio and visual settings. Black for restrictions. There's also a tiny bit of a drop shadow on these icons.

    On/Off Toggles: Less concave look, but still visually interesting and detailed. Matte instead of glossy. "Off" matches alignment with blue descriptive text.

    Descriptive Text: Brighter, more vibrant blue to match both the radio icons and the "On" switch.

    Chevrons: slightly longer and rounded, friendlier to match a new font.

    Feel free to comment below, but please keep it constructive and friendly.

    likes

    about 1 year ago

  2. Alex Alex

    Not so sure about Avenir, everything else looks great.

    likes

    about 1 year ago

  3. Moeed Ahmad Moeed Ahmad

    I like this a lot. I don't see them changing stuff around too much. The last update, they updated the color of the navigation bar and I think they'll do something simple and similar to what you have. I also wouldn't mind lighter versions of those tables. More subtle shadows and lines.

    I also think that using Avenir, while nice looking, reminds of of WebOS a little bit.

    likes

    about 1 year ago

  4. Hugo Kessler Hugo Kessler

    This is super interesting. I agree about Avenir, in fact, I recently launched an app where I decided to use Avenir Next throughout the app--I really like it.
    Not sure about the 'On' toggle (font weighting seems the slightest too light) but that is a tiny niggle.
    I don't think many changes have to be made to iOS besides some of the ones you mocked up above. And I doubt iOS will change experience-wise.

    likes

    about 1 year ago

  5. Louie Mantia Louie Mantia

    @Alex In the spirit of being constructive, would you mind elaborating why you feel so about Avenir?

    likes

    about 1 year ago

  6. Steven Bennett Steven Bennett

    This is really sharp. Love that new blue gradient and the font choice. I don't know if the average user will pick up on the rule that radio frequency text is blue, and I don't know if they would benefit from it, but I could live with it.

    likes

    about 1 year ago

  7. J Bank J Bank

    @Moeed Mohammad — True, but not necessarily a negative. Avenir is interesting. The contrast between the upper and lower cases stands out a bit (just observation), but I guess that's the nature of geometric fonts.

    likes

    about 1 year ago

  8. Louie Mantia Louie Mantia

    @Steven Bennett It's not as much that I'm trying to make a connection from the text to the icon... I'm just trying to get rid of what I believe is an ugly stale blue color they use for the text today.

    about 1 year ago

  9. Sebastiaan de With Sebastiaan de With

    All my yes, reminds me a bit of webOS thanks to the Avenir actually.

    I'd love to see more 'density' at the top of settings though. Quick toggles, easy access to on/off'ing various key features, brightness...

    likes

    about 1 year ago

  10. Brent Caswell Brent Caswell

    hmmm
    what do you think of my approach?

    likes

    about 1 year ago

  11. Todd Coleman Todd Coleman

    I really think that using Avenir is a good idea. It does present a very friendly feel as you said. I've always thought that it is a very modern font so using it as a symbol of "moving forward" is a good idea.

    The three standouts in this concept for me are the navigation bar, the sleeker looking grouped table views and the blue descriptive text. Altogether these create a very smooth and modern interface. I can tell you put a lot of thought behind each portion of this concept.

    The only piece I am not feeling fits are the chevrons. I do agree that they match the friendly feel of using Avenir but I think that they need just a bit more weight for emphasis. But this is more of a personal opinion or preference.

    But as always you have shown that putting a lot of thought behind the little things in your designs really can make a big difference.

    likes

    about 1 year ago

  12. Louie Mantia Louie Mantia

    @Sebastiaan de With perhaps you might like the top section of @Brent Caswell's mockup.

    about 1 year ago

  13. Han Lee Han Lee

    the Nav bar looks really great~~ yet the Grouped table seems not quite match the style of the bar, a bit more flat maybe better?

    about 1 year ago

  14. Louie Mantia Louie Mantia

    @Todd Coleman The Chevrons, I understand where you're coming from. They're the same thickness as before, but since elongated, appear thinner. In all honesty, I wish they didn't have to be there at all, though I recognize their importance. I'd argue perhaps less opacity but thicker, this might allow for them to appear bolder but less in-the-way.

    likes

    about 1 year ago

  15. Louie Mantia Louie Mantia

    @Phantass Could you elaborate on what you mean by which should be more flat? The navigation bar or the grouped table view?

    about 1 year ago

  16. Scott Smith Scott Smith

    I love the use of Avenir. After I saw Runkeeper use it, I felt like it should be used in more apps. I hope Apple brings this to their stock apps.

    Excellent job on the mockup. One thing I would change is that the On/Off switches feel a little too flat, maybe adding just a touch of gloss would fix that.

    about 1 year ago

  17. Alex Alex

    @Louie Mantia Avenir has a much more curvy look than Helvetica does. It may just be the fact that I'm more used to seeing Helvetica there, but this page has a very blocky feel, and to me Avenir offers the opposite. I think a more chunky/blocky font, such as Helvetica, would be more appealing in this UI. Hope that makes sense.

    likes

    about 1 year ago

  18. Louie Mantia Louie Mantia

    @Scott Smith It seems Apple is already using it in a few places: Maps and select parts of Siri.

    Why do you think adding gloss or depth to the switches would make them better?

    about 1 year ago

  19. Steven Bennett Steven Bennett

    @Louie Mantia I misunderstood. If there was more than one settings pane here I'm sure I would have seen that you changed all of the text that is currently the dull dark blu in iOS to your new blue, and not just the radio frequencies. Nice touch :)

    about 1 year ago

  20. Drew Matthews Drew Matthews

    I'm not going to get into the design debate so i'm gonna hang out with another question. Louie approximately how long did this take you to complete. I understand that some of these design choices could have been rattling around in your head or are based on office conversations etc. I'm just wondering about timeframe to lay this puppy out.

    likes

    about 1 year ago

  21. Johnny Van Cura Johnny Van Cura

    I think Avenir is a good comprise for blocky and rounded, but it is a bit shocking to look at, at first. I can't decide if Avenir has a bit too much "character" to be used as a system font though.

    likes

    about 1 year ago

  22. Scott Smith Scott Smith

    @Louie Mantia The gloss has always been a subtle detail of the switch that I appreciated. It gives the switch an added sense of depth, where here the text doesn't feel much "lower" than the knob of the switch, especially in the engaged state.

    about 1 year ago

  23. Louie Mantia Louie Mantia

    @Drew Matthews The majority of the time is spent thinking. In Photoshop though, just the time taken to hit buttons and create layers takes about 3-4 hours.

    likes

    about 1 year ago

  24. Drew Matthews Drew Matthews

    Thanks @Louie Mantia !

    about 1 year ago

  25. Nicolas Prieto Nicolas Prieto

    @Louie Mantia Avenir it's too rounded, if that makes sense. I love it, don't get me wrong, but I don't feel it looks nice paired with the square icons. Maybe the issue is that the font weight it's too light?

    It does looks friendly, but it lacks some "seriousness" (?)

    likes

    about 1 year ago

keyboard shortcuts: previous shot next shot L or F like