81 comments

[ 5.1 ms ] story [ 144 ms ] thread
I like the new look. They still need to update the iWork icons though.
They need to update the iWork suite as a whole. All the iCloud bits have the new UI (Mail, Calendar, Contacts, Reminders, Find my Phone) but the iWork bits all have old UI.

Maybe it's going to be an overhaul of the iWork UI across all their systems?

If they chose any time to update the iWork suite, then it should be now. iWork for Mac hasn't seen an update since 2009, and both iOS and OS X are very different landscapes since then.
In the keynote, they mentioned redoing the entire iWork suite later in the Fall.
Did they? I don't remember that. Did they include the OSX suite in that, or just iOS?
Been a while since I saw it, but I believe they only mentioned something like that there would be "a new release of iWork this year". No specifics about how major it'll be (still "iWork '09"?) or whether that was OS X, iOS, or both.
It's strange they created it using the old look when it was presumably in development around the same time as iOS 7. I imagine the iWork team saw iOS 7 announced at the keynote and though "shit, why did nobody tell us?".
Judging by class names in the div soup of iWork webapp it supports theming, so presumably they'll flip the switch "when it's ready".
This is a good way to see the general direction Apple is taking. I can't wait to see what they're going to do with OS X.
Correction: iCloud Beta Incorporates windows (Metro) look and feel.
Not really. Windows (Metro) is completely flat, there is no depth and it is very difficult to distinguish controls. The direction Apple is taking adds a bit of depth to help distinguish most controls, similar to Android design guidelines.
Honest question: What depth ? All i see is flat all around.
There are subtle gradients. Take a look at the tabs in the contacts icon. Or the (subtle) shadow under each icon.
:) It is the one that you see when it is built by Apple. Says the guy who buys everything Apple produces :)
Well for one they use parallax (on the iPhone) which obviously communicates depth, plus background items out of focus, plus there is a very very light drop shadow on all the icons (oddly a png directly encoded directly into the html on beta.icloud.com) and a shadow around the text.

The icons themselves are mostly flat with some exceptions (Contacts has a very strong bevel and there is a slight bevel on the notes icon).

In iOS7, menu transparency that blur the content below it give a sense of depth in a similar way drop shadows do. UI elements are in the top layer, with content in the lower layer. Parallax in the home screen is also there to add depth, as well as a very subtle transparency in some app that allow you to see your (blurred) wallpaper while in app.

There are also some interesting use of solid color to indicate interactable elements (icons or links that are part of the UI are in the same solid color) that will be greyed out when there are layer above it (e.g. via action sheet).

Most of these are not in the iCloud website, however. And I'm still not sure I like the new visual style.

Except not at all. This has a very different look and feel.

Everything with a modern design is not a copy of Metro. Windows wasn't the first to do flat designs, and most designs (like this) that people say look like metro don't resemble it.

But it is Microsoft who made it trendy among web designers and even influenced Apple. Ironically this trend started by a company which was remarked as "tasteless" by Steve Jobs.
(comment deleted)
There really wasn't one company that made flat design trendy. Microsoft wanted to use web technologies as part of their main OS and flat design was already popular. Microsoft went with the flow like everyone else and they didn't set any trends.
There is a reason people say some designs look like metro: because they do. To the untrained eye, Helvetica Neue and Segoe look very similar; text-heavy flat designs using very similar fonts look very similar. Microsoft might not have been the first to bring this sort of concept to life (they weren't), but they certainly popularised it by virtue of their mainstream reach and their dramatic departure from previous design choices.

I'm not saying Apple hasn't improved the concept with gradients, shadows etc, but denying that Metro was a big influence on the iOS redesign is just unrealistic.

Sorry but nobody who has actually spent time with WM7 and iOS7 can possibly think they are related.

The iOS7 design is about layering, transparency and minimalism. WM7 is far more about its distinctive rectangular, high contrast design.

When people talk about Metro, they usually talk about Windows 8.

I'm not denying that there are differences; what I'm saying is that any Joe Average, asked whether iOS7 looks like Metro or iOS6 or any other OS before them, would say Metro.

There is nothing wrong in admitting influences in art, complete originality is a just a silly myth.

Anyone else wobble their Macbook back and forth to see if the background shifts in response? (it doesn't)
Yep. I liked the effect switching between the home screen and the "apps". My next thought was "I wonder if the parallax thing works too?"

Nope.

(comment deleted)
Actually, a lot of laptops including Macs do have an accelerometer. They use it to detect possible impacts and park the hard drive heads. Probably will be going away with SSDs.

http://support.apple.com/kb/HT1935

As far I know MacBooks without SSD have a chip that can detect movement. Once the chip detects movement that is too fast it will turn off the hard disk to avoid damage. This chip can also be used with a C API.
MacBooks have had accelerometers since the titanium Powerbooks.

They were used to park the hard drive heads in the case of sudden movement.

As mentioned elsewhere, the accelerometers are actually part of the HDDs themselves, so SSD-equipped Macs lack this functionality, sadly.
This is not true. MacBooks all have a Sudden Motion Sensor which has an API that will give you live accelerometer data. Here's a quick list of apps/games that use it:

http://modmyi.com/forums/mac-gaming/800715-sudden-motion-sen...

And here's an open-source Obj-C library to get the data:

http://www.suitable.com/tools/smslib.html

To access the data via JavaScript you can just listen for the "deviceorientation" event.

http://stackoverflow.com/questions/4378435/how-to-access-acc...

Only MacBooks with hard drives have Sudden Motion Sensors, those with SSDs do not.
Nope, but it does animate when you resize your browser window.
It also has iOS-style notification popovers at least for mail and calendar.
Find My iPhone is still using Google Maps. Guess they don't have Apple Maps set up for web embedding.
This will likely come with OS X Mavericks, which will introduce a Maps app
Why would a JS library to show maps on the web come at the same time as a Maps app?
The Maps app could use the JS library for rendering. It's possible the app could have a chrome with different features, but use Web Kit to render the actual map.

    % otool -L /System/Library/Frameworks/MapKit.framework/MapKit | grep Web   
    %
Nope.
It's iOS-Astigmatism!

Get rid of the blurry?

I've been hearing it since it was announced, and I've yet to see for myself, but I really am starting to agree that a lot of the disagreements with the design decisions of iOS7 will go away once people start using the OS. Of course, there are still elements that seem half-baked at best, but it's interesting to see how some of the interfaces really shine when it's your own information being displayed instead of screenshots of information you ignore. I'm actually excited to see how I adapt to the new changes once iOS7 come out.

(Yes, I am a developer and could install the developer preview, but I only have one iOS device right now and no way am I installing a developer beta on my one device)

I've been using the developer preview for a few months and can confirm that, at least for me, the disagreements start to fade pretty quickly. Not to say that their aren't still some problems, but that initial shock seems to be mostly that - just a shock.

As for the iCloud Beta, I actually like this design approach more in the browser. I think the larger screen actually helps the thin font choices and lines feel more appropriate.

Also agree, ios 7 is really nice when in use. Static images don't quite do the "feel" differences in how you interact.

That said, i also am in love with Helvetica Neue now. Was a bit so-so initially but it actually grows on you.

It literally grew on users when they dropped the "Ultralight" from Helvetica Neue Ultralight (3rd beta).
True enough, I didn't install ios7 on my main phone until beta4/5 so any use prior was mostly on an old 4s just to see if things compiled/ran.
I've been using iOS7 since Beta 2, and I still hate it.

I don't like the look, but this might be personal. So putting this aside, to me iOS7 is actually harder to use. The flat buttons (which are just labels now) are harder to press. I do not know if this is psychological since they appear smaller, or is it that the target area is actually smaller now. Toggles are grayed out in their off state, so they appear disabled, as in "you are not supposed to be pressing it now" (see Speaker control in the Voice Memos app).

There are also a lot of other things they changed during the redesign for worse from my perspective. For example: in the Voice Memos app I used to be able to record and play back a sequence quickly. Now * I stop recording a sample * Press Done * Am forced to label it (why!!) * Expand the memo I just recorded (why is it collapsed - I am still working on it) * Hit play

I record 20+ samples a day I need to listen to quickly, and this is so frustrating.

There are other things like this throughout the OS. In calendar for example you can't expand the Notes on the meeting, so god forbid someone puts important meeting information there.

It seems to me like people at Apple actually stopped using their phones. These little things scream at you once you actually try to get something done.

I had issues with the controls that appear during a phone call. I've been an iPhone user since day 1, but the borderless buttons made me hesitate and hunt around for the button I actually wanted to press. Apple fixed this in Beta 4 or 5 and I feel much better about it.

I still find the Repeat/Shuffle buttons confusing in Music.app and I hope they gets fixed before GM.

They disagreements do go away. When I go back to iOS 6 I feel like I have went back in time 5 years.
The wireframe icons, the blues in the mail, the red in the calendar. It looks interesting and terrible at the same time. I just don't like it. Maybe I don't because of the sparseness, starkness and of course the notorious gradients. Next to the iWork icons you can tell that the ios7 design update does make the old style look dated, but that doesn't mean it's appealing.
Seems like it's still being built in Sproutcore, FWIW.
So I guess we're stuck with the Reminders and Contacts icons looking that way. I know it's a silly thing to be upset about but damn if they ain't two of the more hideous icon redesigns for iOS 7.

Notes has this subtle textured background. I'm not a visual designer so I don't understand the reasoning behind why but shouldn't it be a clean white like the calendar, more in keeping with the iOS 7 aesthetic?

What are your objections to the contacts icon? I'm not fond of the reminders one but contacts doesn't look too bad. My only problem with it would be that it still maintains a slightly skeuomorphic look with the ABCD tabs down the side.
That's my primary objection. While the rest of the icons look so light and minimalist, the Contacts icon feels heavier, more complex.
I'm curious what technologies are being used for the web version of Keynote / Pages / Numbers. Is Apple using a javascript implementation of Foundation / CoreGraphics, etc. - similar to Objective-J / Cappuccino?
I guess it's a nice design but I really think it's wrong, really wrong to design a webapp like a native app and their apps look empty. For instance, I personally don't care about different kinds of templates in Pages, what I want is collaboration between different users, this is the whole point of the internet to enable synchronization, live updates and sharing... And imitating a desktop with sticky notes on it, it's unbelievable. I wonder if real people use their online apps, I can't imagine this is the case. All it shows to me is how much they don't get the Web and how much it's not in their DNA, it's scary.
>> "For instance, I personally don't care about different kinds of templates in Pages, what I want is collaboration between different users"

On the other hand I'm sure a lot of people do care about templates and would never use collaboration. I'm one of them. I don't create text documents often and have never needed to collaborate on one. Collaboration seems like more of an enterprise/business feature to me and that's a market Pages really doesn't seem meant for.

LOL. You're not looking for an Office product from Apple then. And I say that as a happy buyer of Apple products, but come on. Emulating old school products and putting finesse above functionality? What else did you expect?
I have never understood why I can't get to photostream through this.
I really like this redesign. The old one was horrible imo and I was worried they'd update iOS 7 and forget about iCloud (even though I don't use the website that often it would still bug me).
Interestingly it looks like they're still using Google Maps in Find My iPhone. I wish they'd also change the name of that seeing as it finds iPhone's, iPad's, and Mac's.
Helvetica Neue - that wonderful font again.

Sorry for being off-topic: can anyone please recommend a (legal/accepted) way for licensed use of Helvetica Neue on websites/apps without having to purchase it from expensive font vendors like Adobe or Myfonts?

Remember that all OSX/iOS users will be able to see it, so it may be that it's not an issue, depending on your demographic.
So… how are they doing the blur before you log in? Quick poke around, can't see any -webkit-filter, and can't see any canvas…
looks like they are doing it in javascript with data:image/png;base64 urls. Not sure if the blurs are precomputed/stored or computed in the browser.
Works quite well in FireFox, which is nice until you use the find my phone which requires Google API for some reason (which I have blocked). I prefer developers to use their own javascript. Why wouldn't they?
I'm still curious what they're going to do about these apps: Find my friends, Airport Utility, Apple Remote, iTunes Connect Mobile, Apple Store.
Probably update them after iOS7 ships.

It wouldn't surprise me if they are in the same position as external developers i.e. have to wait until iOS7 GM before the App Store will accept the binary.

Is there a way to enable EMACS style bindings in the iCloud Beta iWorks programs? They work in iCloud Mail.