DISCLAIMER: This is a non-functional concept of a non-existing version of iOS built from scratch in Adobe Fireworks CS6 and rendered in Adobe After Effects CC. There is no download link or ways for you to use this right now.
NOTE: If you don't want to read this whole thing, I feel you. Here's a quick video that explains everything you really care about! Right here.
EDIT (2020/06/22): Wow, I did not expect to go back to this old blog and article to add and edit, but here we are post-WWDC 2020 after the unveiling of iOS 14. Before anything, congratulations Apple on this fantastic implementation, the widgets really look great; they’re truly a 2020 version of the iOS Blocks. I just want to say that it’s a bit sad that Apple, in 6 years, didn’t try to reach me. I never expected money and I don’t even want the credit or anything; I just want better tech and better UX/UI. I had such a great experience with Microsoft after the Windows 8/10 design project that it would’ve been nice talking to someone at Apple. Just a “We saw it, we love it, we’re working on it” would’ve been nice… You can read a great article about all this on Input Right here. Enjoy the new Widgets, it was the way to go :)
BACKGROUND
Here’s the stronghold and I’m the little bunny who can barely move around a sword going straight for it. If anyone sends me a picture of a bunny me that can’t move around a sword against a giant Apple stronghold castle… I’m putting it right here!
Edit: Here's a first one by @LaurenKretsch, Awesome!
Windows Phone is getting more traction and Android is winning the polls with the most users. Yet, what those numbers don’t tell us is that the iPhone and iOS are both maintained by one single company (although we can say the same about Windows Phone with MSFT/Nokia and kinda Google with the Nexus). Apple is still winning in this, they are alone with their phones/tablets and platform and they are selling more than any single company with a minimal number of devices. Samsung is growing, yes, but with a hundred different models and fighting with every strategy in their hand, including a crappy ugly skin called TouchWiz filled with every single useless possible features in the world, but that’s another story.
iOS is still a winner mobile operating system. Apple may be losing some sales, but they are far from losing the fight. The big question though is how?
I mean yes, Apple has huge brand loyalty that mostly came from the time they were extremely competitive and innovating, but they switched to a very slow evolutionary approach now. Hate me as much as you want, but the fact is that…. Apple, is kinda behind the competition right now… yet, successful. How?
Since trying to push iOS is a little trickier, and you will find out why pretty soon, I am going to change my usual writing structure for this one by blending the analysis and research directly. We need to take a very good look at the competition, throw a huge sword at iOS and Apple slicing them in half and watch how they manage to just get back to one piece without a scratch. Understanding iOS first and from there try to push the OS a bit without messing up anything that makes it so special.
This is going to be rough and nasty, but I suggest you read it all even if you just want to stop and slap me in the face.
Let’s begin by a simple analysis of the current situation.
THE MARKET
What’s important to understand right now, is that none of the 3 major mobile OSes are in a perfect position. Let’s say that there’s three big criteria for a mobile OS: Applications, Customizability and Experience.
Applications
Applications is basically your App Store, Marketplace, Play, however you want to call it: How many apps can you offer to your users. Number does NOT say everything though. If you look at Blackberry you’ll see that a HUGE number of their apps are actually crappy old ported Android apps to take advantage of a free device promotion and a big set of them are actually all made by a remote Chinese company. iOS has the majority of apps, Android is extremely close and Windows Phone is running after the players whom always forget that there’s a third ecosystem that is growing. What I’m saying is that the number of application is as important as the quality of those available applications.
iOS is, as always, ahead of the game with the majority of applications built to perfectly fit iOS, even the weird iOS 7 “design language”. Small side note that we’ll explore a bit later, iOS 7 may look like an unorganized/in-coherent mess, but there are lot of amazing applications that look and work great using the same weird guidelines; developers are better at Apple’s own game.
Android is another story since developers have no idea how their apps should look and feel like since there’s a new design language and guideline nearly every year. When apps do update to the latest design language it’s all good and nice, but a lot of time you end up with different looking apps that don’t even all blend well together. Some even reminding me of the time I was building forms with Delphi (that’s very bad if you ask).
Windows Phone… well is getting better. The design language is quite simple when you take the time to check it out and understand how it works, but that’s something that a lot of app developers don’t do since WP is not important for them and therefore affects the general app quality found on the platform. Windows 8 is pretty much the same. Microsoft is changing their game with the excellent Universal Application guideline and tools for Windows Desktop, Tablet, Phone and even Xbox so we’ll see where this leads. Side note for Microsoft, pushing websites as apps is amazing on the technical side, but a crapfest in terms of app quality…
Customizability
Customizability is how far can you tailor the experience of your phone to suit your needs. The short answer is forget iOS, Windows is great and Android is just crazy.
On iOS you can’t do shit. You have to open and close every single application. Open mail, check your Mail, close Mail. Open Facebook, check Facebook, close Facebook. You might say that your notification center helps you on this –true- but what about news or just looking at the latest photo a friend posted, there’s no notification for that. You have to hunt for the content you want or might want. iOS basically gives you a static grid of everything you have on your phone and tablet and you need to go through all of them to get the content you want. You can change the backgrounds and move around your icons, but that’s basically it. No functionality, no features, no personalization… nada… zero… absolument rien… kedal.
Android is the exact opposite of iOS on that department. Every single thing on Android is changeable. Everything. You can change the default messaging app, change the way notifications appear, add widgets and you know what… let’s just change the way the whole goddamn OS looks like up to the navigation itself. Yes you can. It is truly astonishing how far you can customize and change Android and let’s not talk about a rooted version. The biggest customization element of Android though is the homescreens. You don’t need to be a geek to love and take advantage of this feature (although you might need to get a bit out of your comfort zone to get used to and master it). Basically imagine a mini app living on the main page of your phone. If you want your list of applications (like iOS) there’s a fine button for that, otherwise your homescreens are a simple canvas to fill with folders, shortcuts to the apps you really use and love and of course your widgets. A widget can not only display information, but you can also interact with it. They have buttons, scrollable content and can update on-the-fly. Mini apps living on your screen!
If you look at a Windows Phone you might say that it looks weird. Actually you can pretty much say the same thing about your friend’s Android phone too. The thing you need to understand about those phones is that they are customized and adapted to the user; they made it look the way they want it, so that’s why you think it looks weird. Windows is the middle ground between iOS and Android. A way to look at it is that iOS has 10% customization, Android has 90% and Windows is right there in the middle at around 45%. Why not the extra 5%? Because you can only customize inside Microsoft’s established fence, you can’t jump over it if you really want to like Android. Customization is still excellent with the platform putting the Live Tile system front and center. Again, a middle between iOS and Android since it’s an app icon, yet gives you extra information, but not to the point where you can interact with them. Windows Phone 8.1 let you add a wallpaper though the tiles, will let you change the entire lockscreen design, you can add more tiles if you want and you still have the option to choose the accent color of your choice. It’s far from Android, but way more than iOS.
Experience
Experience is how the whole thing works and feel. You have your apps, your email accounts, you’re receiving your text messages, the thing is connected to the internet and your cellular network… now what? How is everything integrated together, what does it feel like to use the OS in your everyday? Experience is the key thing here. It’s great to have apps and it’s awesome if you can modify everything, but you’ll be using this phone every day, so it all needs to be tied up together pretty well in both the way it looks and feels! Before we start, I just want to say that there’s a big debate about Skeuomorphic design and Realistic design and what exactly is Flat design and honestly I’ll try to use none of those terms here. This way we’ll all be sure we get to understand what I’m talking about and your maybe wrong preconceived idea/definition about, let’s say what Skeuomorphic is, won’t affect what I’m trying to explain here.
iOS has a pretty solid experience. You have your list of apps, you open it, have fun with it, press the single button on the device to go back to the menu and open another app. It is a solid experience… because there isn’t anything else to do. iOS is extremely straightforward. Swipe from the top and you have all your notifications and upcoming events. Swipe from the bottom and you have a couple of quick options and shortcuts. Thank Android for that though. In terms of design, this is where it starts to go south. Since the beginning of iOS, the platform reflected a lot your everyday life in an aggressive way in the way it looked. You could see wood, leather, paper, gradients, stiches, shadows and even little reflections on every button or corner. iPad apps pushed that idea even more to the point that you really had the little wire that holds the pages of the wood/leather book with the shadows and textures actually showing that it is open –on your digital screen. Taste is extremely subjective, and for devices that wanted to show people that high technologies is accessible and useful, I actually think that it helped the masses to approach the scary and complicated idea of having a full computer in your pocket or a full computer that is basically just one big screen. Say what you want, but it worked. It worked and it was extremely well executed; that was the key here. Everything looked the same, felt the same and had the human touch and the rich textures. Even if as a UX Architect I did not like it in terms of taste, objectively it was extremely well executed and uniform. With iOS 7, Apple took the big step forward it needed with a more modern design overhaul of the platform. They unfortunately left behind their precise design execution and took two more backwards. Before, iOS represented the world as you know it in your pocket. Now, you have a weird blend of minimalism with flat colors, semi-weird web 2.0 design with gradients and inverted gradients and still some uses of pre-iOS 7 realistic design with floating 3D bubbles. There’s a lot of bright colors… next to some grayish icons and full flat black ones. Things fly from every direction with huge animations. There’s even blurred see-though glass. This does not feel uniform at all. Before it was a matter of taste only and even if the whole world would hate the way it looks like, nobody could say that it didn’t work and feel the same way throughout the platform. I read a funny mention somewhere on the web saying “When you don’t have any idea what to do, you use see through glass-like transparency.” Guess what, that’s what Microsoft did with Windows Vista and now Apple has done the same with iOS. The experience is bland and straightforward for a supposedly smartphone and the same is now reflected on the interface itself. On the iPad side, you basically have a stretched iPhone and technically the iPhone is a stretched iPod Touch that can call. Apps are good, yes, but you can make a crappy experience around them especially if you’re selling a tablet that can’t even let me talk to someone while browsing the web for 500$. iOS needs some “more” and some polish.
Android has been the star of the show. Not because it has a perfect experience, far from it, but because of the speed at which Google are improving it! Android has been a mess without any true personality in the beginning. A lot of companies, unfortunately, still think that it’s the case and that they need to differentiate their product more by changing the way Android looks and works. This may have been the case with HTC improving Android with Sense on the HTC Hero back then, yet doing so today is a different story. The Android team have Matias Duarte on-board, one of the best UX Architects I know of. He’s the one who designed WebOS including the multitasking card paradigm. This is one of the main reason why Android passed from a lifeless, unorganized mess to the Android we know of today. If you want to use Android at its best you need a Nexus, Google Play Edition or Cyanogen phone, otherwise you can’t really call that Android. The interface is cleaner, faster, refined and gets better every year. And that’s a problem. As much as the interface gets better at every iteration, they come up with new design guidelines that a lot of developers can’t follow at a fast enough pace. Add to that the ridiculous number of resolution, screen sizes, device format and button layout and you’re in the right track to confuse and limit the creativity of your developers. So you end up with a lot of apps that don’t feel and work the same way, and this can create some confusion. Widgets, however awesome they might be, are not an integrated experience either. There isn’t really any true and respected guidelines on how to build Android widgets and it shows. On top of that a Widget is mostly independent from your main app which breaks the experience even more. I’ve been using a red Nexus 5 for months now and however awesome widgets might be, I don’t use them at all because I’m an idiotic excessive design purist. Another part of the broken experience is the integration of basic applications. iOS and Windows Phone have excellent integrated first-party apps for all. Email and texting and camera works all well, but Android disappoints if you’re out of Google’s world. Every application is becoming a Google specific version and if you’re not plugged in to Google with, let’s say Gmail, the basic email apps really sucks and didn’t even sync my emails correctly. Yes there are third-party apps that are excellent like CloudMail for my emails and EvolveSMS for my text messages… but they aren’t as integrated and always have a couple of weird things about them that hinders your experience. Nonetheless, Android is rapidly evolving and the experience is simply getting better every year, especially if you live in the Google world.
Windows is, again, the balance of the two. The Windows experience is, I think and with some pretty good observation, the best of the bunch. That is with what Microsoft can control because otherwise everything around it becomes problematic. Since my move to Android to get to know the platform for this piece, I’ve started to use a Pebble and a Google Glass. I’m waiting for the Lumia 930 to be released, yet I’m so afraid to go back to Windows Phone because there isn’t any support from the Pebble team and I can forget any kind of support from Google. That’s the problem with Windows: Apps. I’m not so much of an app person. In fact I pretty much hate apps. Yet, the situation with Windows affects me with third-party devices. I don’t care about Snapchat, I have Facebook Messenger (that yes, gets always updated the last) where all my actual friends are and even text messages; what’s the use? But I’m screwed if I want to use a smartwatch like the Pebble or the upcoming Moto360, I’m screwed if I want to use a Nest thermostat and yes, I’m screwed if I want to use my Square scanner without keeping an iOS or Android device with me. Is that Microsoft’s fault? Of course not, they did a fantastic job with Windows Phone and Windows for tablets, ut it’s a burden for consumers and nonetheless affects the overall experience of the platform. If you look outside of the apps problem the platform is pretty amazing, especially with 8.1 onboard. Everything is nicely polished, performance is incredible, buttons are standard on all devices and the platform just feels like one very integrated thing. Live Tiles are of course the star of the show here being front and center on the devices and with reason. Compared to widgets they have a standard look and feel, you know that they will always open the application and fits nicely in a grid on your Start screen. They may be nicer than widgets, but unfortunately you can’t do a lot more with them, each Live Tile is just a shortcut for inside an application; they just show you information and open to where the full info is.
iOS is falling apart and lacking any kind of distinctive organization/innovation. Android is improving extremely fast and has widgets that let you do things without launching anything, but can be a bit of a mess sometimes. Windows is extremely integrated and refined with their design language and Live Tiles, although you can’t interact with them and the apps/support might be an issue for you if you can’t look past it.
Phew, that was a lot of analysis. Now that we’re done with the others, let’s focus on iOS.
Note
This research project or I are not affiliated with Apple in any way.
UNDERSTANDING iOS
Usually I have my set of rules when trying to redesign, fix, push, improve or analyze anything, but we need to go deeper first.
I highly recommend you read my previous post called “The Competition” so you get a better picture of the current market and products. It’s a quick analysis that can give you a good additional insight for this analysis and proposal.
Even with everything I have described on top, iOS is still a widely used mobile OS.
Why? How is it still successful? Let’s just get into this one last time for a second…..
You are paying a huge price for a phone that is thin by sacrificing the battery and forces form over function by using extremely delicate materials like glass on the back so you end up buying an ugly giant battery case cover ruining the whole thing. Everything you do on iOS is locked in Apple’s world. Bought a book on the iBookstore and want to do anything outside Apple with it? … nope. Buy it on the Amazon app and you can use it on every single platform on the world… while paying less and having more and this same problematic is throughout the OS. iOS 7 is a design nightmare by Apple’s own standard with hundreds of inconsistencies and bugs. Your tablet is just a stretched out iPhone with no better features or function whatsoever with the bigger screen on top of an interface that does squat more than your phone. You are paying a ridiculous amount, for a fragile inefficient phone locked in an extremely closed world all with battery issues and design inconsistencies and an expansive tablet that does not bring anything more to the table and can’t even stand straight by itself on a table requiring an ugly huge case again or a very annoying magnetic cover. You can’t even do two things at the same time (although the rumors say Apple is working on that). Why on earth are people still buying the iPhone and iPad? If we put the obvious “because there’s a fruit on it” answer aside, it all comes down to one big reason.
It is simple. Dead fricking simple.
No really… that’s it.
Everyone from every age can use iOS and understand iOS. It is so dumb simple and straightforward that it is beautiful. Not just the way it works, but the whole story around it.
You have a problem with the phone or tablet? You go to an Apple Store. They made the device, they sell the device and they support the device; good luck with your Android phone. Simple.
You want an app even if I personally find them pointless? Well you can tell me to go something myself because it’s most certainly in the App Store and you’ll enjoy every second of it. Simple.
You want an accessory or anything for your iPhone or iPad? Boy believe me that you’ll find a shitload of accessories for them. Hell, they even release some accessories before the device itself! Simple.
You may be locked in a prison cell with the Apple ecosystem, but it’s quite a nice prison if you accept that you’ll spent all your time only inside of it with all of the media and communications you can imagine. It sucks, but simple nonetheless.
Simplicity. Stability. Confidence. These are the reason iOS is still popular. Of course there’s a huge brand loyalty factor in there, but that’s because Apple is still a reflection of those 3 big things.
Let me tell you a secret… I used to be an Apple user (fanboy would be more appropriate). I had a MacBook Air, an iPhone 3GS an iPad; the whole package. Yet, like many others, I left. This is where we cross the streams.
Apple is still king because users have a strong loyalty in Apple and for reason. Yes, time have changed and Google and Microsoft are really in a good position to beat Apple, but users don’t even look at the others; they go in the store and ask for the latest iPhone or iPad, they don’t care about the others.
But this is slowly, yet dangerously, changing.
THE "PROBLEM"
iOS is a winner because it is the simplest OS on the planet. It has worked the same way since its first day of existence. This is the reason people stay. This is also the reason why people leave. We need to improve and push iOS to new grounds and fix some shortcomings with the platform while making sure it stays the same for people who like it. It also needs to be a gradual change to avoid useless changes that can alienate users.
We need to get the best elements from the other platforms, things that might convince people to switch from iOS, and bring them to the fruity world to push the platform forward. Apps are totally fine. The leak is clearly around the Customization and then Experience department, especially if we compare iOS to what the competition is offering.
I don’t want to change iOS entirely and that’s super important. Some users say that iOS should have widgets and should let you change the interface and the default app and bla bla bla. You know what? At that point go get an Android phone. We need to push it forward, but make sure it stays true to what Apple and iOS is.
So I’m going to propose two things here to begin with. A minor change and a major feature.
WHO'S iOS?
First of all, iOS needs some visual direction; a proper design language. If you look at those icons you clearly see that the mix of gradients, inverted gradients, 3D, flat and grayish content does not blend well. Here’s the catch though… we can’t change the icons.
For a designer, it makes sense. The icons don't look good, let’s change the icons. In the real world, especially on a UX perspective, that is a critical and bad move. iOS is known for its simplicity and stability. iOS is used by so many different kind of people from all ages. iOS 7 was already a big design move, you can’t do another one this close. This is far from stability, especially as your users are getting used to the new style, so changing all the icons –yes, even if they kinda suck- is a bad idea.
What is iOS’ personality? I may have an idea.
iOS is about simplicity with a touch. iOS should be modern and sleek. Extremely simple, and gives you a familiar perspective. There shouldn’t be any textures, so that tiny paper-like texture still present on the Notes icon should be gone. There shouldn’t be grayish icons, iOS is fun and engaging, dark gray should be used as it is close to black to get your attention. There shouldn’t be anything flat, minimal gradients to give it the little personality and extra depth. This is not Windows with Metro, this isn’t flat territory. But this isn’t 3D either, so those bubbles don't work at all, at least not looking like that. Killing the bubbles would mean radical change and we can’t do that yet as this design exploration is a first pass. iOS is colorful and bold. Gray on gray, dark on dark, whitish on white does not work. It should always be very clear, contrast-y and very visual. Fun and engaging also means no unnecessary details. Sorry, but that settings button looks horrific. It looks like a crappy stove. Yes I know that it’s supposed to represent a bike chain/cog wheel whatever system, but when a lot of people call it a stove, grow some guts, know your mistake and change it, especially when it’s not an important change. Learn to do 180 degrees turn Apple. Don’t push things because “you’re Apple” and people should just live with that and keep forcing that they should like it. You remember the “You’re holding it wrong” incident right?
Here’s how it looks like when we apply all of that to the icons. There isn’t any major icon change. Other than camera and settings, things are mostly the same and that’s good. Nonetheless, I have redone all of the icons and colors from scratch based on the current iOS 7 icons. Their pretty much the same, but there’s subtle modifications that will make them feel more integrated, more unified and more true to itself. They all have the same degree of gradients, the same bold approach and the same structure. Gray sucks with the design you have. If we just take the Camera icon, why was it gray? The camera interface is black?! It doesn’t make any sense. Black is easier to spot which is critical when you want to take a photo and boring gray doesn’t fit with the fleet of colorful icons. All about contrast here. All those details, creating a coherent basis. Yes you may still hate the icons –on a personal level- but at least they all have the same design language and direction and that is something that can’t be judged. They look mostly the same and feel the same so a minor redesign like that would be perfect to make a statement over the design decisions while also making sure you don’t alienate your users with another redesign.
Also, another little thing I’d like to add, an option in the settings to remove the text labels. It actually looks super great without them and for a device based so strongly on icons, it would be great to really make them front and center without any noise around them.
That’s for the icons and it’s a baby example for the changes I would like in iOS. Applications should pass through the same process and get a similar minor makeover based on a strict and precise design language. Unfortunately, redesigning all the applications is not the objective here. That could be a nice future project though. Here’s my super simple idea that could really enhance the iOS experience.
INTRODUCING THE iOS BLOCK
Apple has always liked magic tricks. “Here’s how these guys are doing it and here’s how these other guys are doing. Now here’s how we will do it.” That was Apple at its best, always providing the best with surprise and always a notch higher than the rest of the industry. I want to bring that magic back.
Android has the Widget. A Widget lets you have a mini app on your homescreen. You can interact with it, but it doesn’t really have any guidelines, it’s disconnected from the app itself in most cases and can sometimes create a mess.
Windows has Live Tiles. A Live Tile is a more powerful icon being the shortcut to the application itself while also giving you a lot of information. You can resize them to have more or less information, although you can’t do anything more than jump to the app as there is no way to interact with one.
iOS has, well nothing. Just a basic icon.
That’s the problem and here’s my solution.
I call it the iOS Block. Android has Widgets, Windows has Live Tiles and iOS now has Blocks.
A Block is the best of Android and Windows Phone. You can interact with a Block and actually do stuff with it. But, you can also access the application directly from the Block since it is the app itself, not a separate entity. There’s also some very clear guidelines on how to build and use a Block, so the experience is very controlled.
The best of Android and Windows Phone. Apple magic.
What if you don’t want Blocks? What if they are too complicated or you don’t need/want them? No problem, don’t use them and iOS will look and work exactly as before. This brings changes to people who want some, yet leaves users who don't want any with what they always liked.
For the iPhone, it’s a great way to be informed and interact with your apps without opening and closing every single one of them. For the iPad it’s a great way to slowly bring you to a more productive product as the extra space can be leveraged.
Here’s how it works. On your iOS device you have your list of icons like you know and love. They work and look the same way as before. But, if you want more information about an app, you can simply pinch the app icon bigger and it will now become an iOS Block. There’s no menu, no hidden options and no weird gestures to do. You literally make the icon bigger with your finger if you want more; it can’t be simpler and more intuitive than that.
When you pinch the icon, you will see the transformation/transition into a Block and at that point you have two choices: Either you pinch it back to an icon since you got the information you need or you release your fingers and the icon will remain a Block on your iOS screen. This combination of transforming into a Block either to quickly consult or to change your home screen is critical. You can easily have your next calendar event showing on your Calendar block on your iPhone and you can quickly go through 3-4 apps using a quick pinch and pinch back maneuver on your iPad to quickly consult an app and not end up opening and closing every single one of them.
I may have sucked to explain this, but the video above really shows you how it’s done!
Okay so it’s super easy to transition from an icon to a Block. Cool. If you like the way iOS is, you don’t even have to know that they exist and you can be a happy user. Awesome. It’s there, it’s easy, it doesn’t bother you and it’s super accessible. That’s all great!
But what can you do with a Block? How do they actually work?
Let’s go through some basics.
A Block has three possible sizes. 272 x 296px for the iPhone, 504 x 474px for the iPad in portrait orientation and 544 x 434px for the iPad in landscape orientation. Of course, these are Retina resolution and Blocks would only be compatible with Retina-equipped devices as the extra pixels would be necessary to ensure quality and sharpness on-screen as it gets pretty small on your display.
By the way, you can’t resize them. I know, it sucks, but if you really want that much control, go get an Android or Windows Phone. Apple has always been about setting a clear experience and yes, the Block is a first step towards more option and customization, but all of that within Apple’s rules of a controlled experience. For developers it is much easier to develop an experience with clear and defined guidelines, just look at iOS’ apps; developers know what exact resolution and size all iOS devices use.
Blocks basically take the space of 2x2 icons on both the iPhone/iPod and the iPad. There’s still a lot of questions around some actions and movement around the Blocks system like what happens when you expand a Block and the page was already full of icons. Do the icons under the newly created Block form a new folder to stay on the page? Do they get pushed to the next app list? If so, would it push content from that second one to the third and so on if there’s not enough space? Unfortunately I don’t have an answer to those questions. This needs a lot more of actual testing, something that I can’t do since it isn’t a working solution. The Block system is tested and is an idea that does work, but everything around it would require an actual working version to see which one works best in your everyday life (because let’s face it, Apple would never add an option for you to choose what happens….) As of now, they are pushed to the next screen.
Blocks also have clear guidelines to make sure that 80% of them look, feel and work the same way. Of course, like the iOS app guidelines, there’s a lot of variations. The objective is to make sure that the average of all Blocks (like with iOS apps) gets as close as possible to the guideline.
The average Block is divided into three main sections. The first being the icon. The icon is 50% the size of the regular icon on your phone and 65% the size of the icon on your tablet. In the case of the tablet you will also double the padding. When you tap on the icon on the Block you will open the application. This is a clear and simple way for everyone to understand the Block since you still have the app icon visible and a sure place to launch the application. The second section is the Control or Tap Zone. The Control / Tap zone is where you would technically place buttons if you choose to include some. In terms of tapping on a Block, this would technically be the only place to do so. The last section, the rest of the Block, is the Content or Interaction Zone. This is where the content will be. Think of it as a Live Tile, giving you lots of quick glanceable information. The main difference is that you can actually scroll and swipe the content. This minimum layer of interaction with this section is key as it eliminates the use of buttons. Buttons suck, and you want to use them to a minimum, so you want to target something that you can scroll or move to the next element by swiping. There shouldn’t be anything tappable on this section to avoid any confusion. In the best of worlds, your Block should give you information and let you scroll quickly through it to get more. If you actually need more than that preview, you tap on the icon on the bottom left and jump into the app.
In terms of visual identity, you need to follow iOS’ visual style. Simple non-flat backgrounds being the content itself in the form of pictures or better yet, a stretch of the light gradient from the icon to create a smooth transition. You don’t want anything flat. Any extra content should not be cut à la Windows Phone and should be under a smooth gradient to none, especially if there’s buttons.
This is the balance act between Android’s Widgets and Windows Phone’s Live Tile. The best of both worlds with an Apple/iOS twist. This would only be the first step to really push iOS forward, but a crucial one to really have offer a better solution than opening and closing every single application; this isn’t 2007 anymore.
Now all this theory is great, but how would they actually look and feel like?
I have 5 examples for you. I think they cover a good range of possible scenarios and if you guys really want more examples, we could build a Block for every single existing first-party iOS application. Actually, why won’t you take the guidelines and actually try to create your own?
This is the Weather Block.
If you looked closely at the Weather icon on the top mockups, I did kill the transparency effect on the cloud. I think that it wasn’t true to iOS and it did not blend well as no other application had a change in opacity on one of their icon elements. The Weather Block is true to the iOS 7 Weather application. It will reflect the current Weather of your favorite location (or current position) visually and with the actual temperature. You can also see the temperature at the next moment of the day if you are checking it on an iPad, leveraging the extra space. If you swipe, you will have a look at your other location found in your Weather application. Extremely simple, yet efficient. The objective is to give you a quick access to the Weather and your different location while giving you a quick hint of what’s coming for the day, all of that without having to open the application. Of course, if you want to open the application, you just have to tap on the bottom-left icon.
This is the Music Block.
The icon and style got toned down a bit and the gradient got inverted back to a regular light-to-dark style. The Block shows you the album of the song currently playing. It fades nicely as our Block guidelines clearly state that content must be faded if there’s any kind of bottom navigation. Three buttons are always there for you to quickly play back the song or go back, play / pause and change the song. Yes I know, that is always available in the quick menu, but I’m just showcasing the possibilities here. On the iPad, the actual song name and artist would be shown on top of the album art.
This is the Calendar Block.
The Calendar Block is pretty cool as you would always see exactly what appointments are upcoming based on the moment of the day. The day would always be displayed and this is an example where the icon rule can be broken. There are exceptions for every rule, but don’t forget that this was already an updated icon on iOS 7, so already an exception. Something extremely important though is, as much as you can bend that rule, you will ALWAYS open the application when you tap on the bottom-left. That is a complete standard and it is crucial for the Block experience and accessibility that it works the same way for everyone. Another cool thing about the Calendar Block is the ability to swipe up and down for a quick view of the day.
This is the Messaging Block.
What about a quick view of your recent text messages and conversation? This Block will show you your latest conversations and will let you quickly scroll through them. You may ask though “Can I tap on a person’s name and directly jump in the conversation?” Unfortunately that would be a no… for now. Blocks are new, and basic functionality would need to be extremely controlled and as the guidelines clearly state: this is a swiping and consulting zone, you don’t tap and take actions there. Again, this would need more testing to see how fast the average user can familiarize to the Blocks concept. If they all start to tap on a conversation and ask why it hasn’t opened... you pretty much got your answer there! The Messaging Block is especially useful for quick information access. Double step registration becomes super easy and if your friend sent you an important information, well you don’t need to open the Messaging app to quickly get that piece of information you need.
This is the Photos Block.
You can choose in the settings an album you really like and it will show pictures either in random order or latest to oldest. An option to automatically switch pictures would also be there. The default would be a non-autoswitching behavior and would show up the last picture you took with your phone in the Camera Roll. Always great to see the last picture you took and then click to open the app and show to your friend.
Those are just some examples of how an iOS Block would work and be used. The beauty is again in how non-existent they can be for someone who finds them too small or simply hates the idea. I’m sorry buddy, but you can’t hate this idea, because if you don’t like it, don’t use it and iOS would be exactly how you like it; it’s a win-win for everyone. If it really gets you frustrated though, you should take some time to analyze the fact that you are basically hating something that you don’t even need to know exists and that would make another person happy. Anyways!
The best feature though is quite obvious: Third-party integration. Imagine the sea of applications that could take advantage of the Block paradigm and really push their apps further. Your last Facebook notification, shortcuts to create a new quick note in OneNote, the latest weirdest crap somebody said on Secret (why is that even important to you?), etc.
iOS is in a bad position because people are staying on iOS since it has always worked the same way… and people leave for the same reason.
How do you fix this? You fix this with the Block. Everybody wins with this.
Before we conclude, let me add that…
ALSO...
Keyboard
Seriously, this is dumb. Put the letters in lowercase if I’m writing in lowercase and put them in uppercase when I press the shift button. Put your ego aside and worst case, burry very deeply an option for this because as of now it’s ridiculous. I’m not even asking to install multiple keyboards or even a swipe/flow like feature, but fix this little obvious thing. If you dare say that it’s a design decision, please look at the rest of your platform…
Profiles
Look, in the best world ever, you would like for the father, mother, the twins, baby and the dog to have an iPad. It’s not always the case. Look at Android and Windows and please offer a way to have multiple profiles on one tablet; it doesn’t make any sense.
Flexibility
Please, oh please, show a minimum of flexibility. Controlled experience is great, I know, but it annoys your power users in the process. I tried to download and play a video on my development iPad. Actually that video was the interface simulation for the iOS Blocks. It didn’t want to save it. Why? Because the video wasn’t considered standard resolution or the level was higher to 4.2. I’m talking about a H.264 video that is the exact same pixel resolution of the device’s screen… it failed on both the iPod and iPad. How can the device not play the most common file format in its own resolution? When I actually managed to get them to play, well they super lagged unless I gave them a huge advance in the beginning of the video for it to “prepare itself”. Really? That’s only ONE example of many places where your device is kind of useless. Show more flexibility, think about more use cases, and think about your power users.
File Explorer
Lol, like if that’s going to happen anyways. Let’s add in there kickstand for the iPad, removable storage and removable battery for the iPhone and all the little useful stuff we might all think of together while we’re at it.
UX/UI
That one was obvious if you actually read the whole thing. But, I want to add some crucial UX problems I found on iOS. A good example would be the Dropbox app. A lot of applications have this thing called slide down to refresh, and it works great. Yet, Apple decided that in iOS7, sliding down would be search. So now you got some applications that sliding down means refresh and other that sliding down means search. I challenge you to find a refresh button on the Dropbox app and I’ve been having problems with that. There’s a lot of functional and structural problems to iOS, yes what I mentioned is mostly third-party related, but so is the Windows Phone app gap and it’s still listed as an issue. Please kill that monstrous frosted glass.
Performance
Seriously, for a device so thin in features and actual stuff to do, performance is disappointing. The Google Chrome browser scrolling is horrific at times with a HUGE delay. Is that Google’s fault, maybe, but Safari isn’t as good and complete and Apple refuses to let third-party browsers access the full performance potential, so Apple’s fault there!
(Real) Multitasking
If you don’t know what I mean with that, please refer to any Windows 8 tablet. Once you've played with that it’s pretty amazing and it doesn’t make any sense to constantly switch between two apps because I can’t fricking talk to a friend and browse the web at the same time on a 500$ machine with a huge screen. URRGHHHHHHHH you were the chosen one! Rumor says that Apple will be announcing a multitasking solution for WWDC 2014, so we’ll see if that’s true pretty soon!
Value
Worst value ever. For the price of one iPhone, I can get 7 Windows Phones. On top of that, each of them does not explode on impact on the ground, has better battery, a functional navigation system, an interface that is way faster, lots of integrated services that I can access everywhere, etc.
Remember Dieter Rams
Is innovative; Not so much these days.
Makes a product useful; Constantly opening and closing every app and running for the plug to get a device thin is not useful.
Is aesthetic; iOS 7 isn’t. Just refer to the icons.
Makes a product understandable; Except some UX problems due to the new style, I’m giving you that one.
Is unobtrusive; You’re trying too hard for it to be beautiful, make your art in the way that it’s super solid and lasts all day.
Is honest; Oh boy are you making your iPad look way more powerful and useful than they are…
Is long-lasting; In terms of design, yes. In terms of what’s inside and maintenance, nop.
Is thorough down to the last detail; In terms of hardware, totally. Software, absolutely not.
Is environmentally friendly; I’ll trust your marketing there and say yes, although changing a whole device because of one broken piece, isn’t that great.
Is as little as possible; Who the hell puts glass just for fun behind a phone. This is a device you always carry and will get bumped and dropped. In no way this is good design and is clearly a non-essential against the purpose of the device.
CONCLUSION
Look, I’ll be honest here: This isn’t enough. If I really wanted to fix iOS on a technological standpoint, I would need four times more time, analysis and solutions. Unfortunately, fixing iOS is technically not possible, because trying to fix iOS would mean adding more features and options thus making iOS… no longer iOS?!?
What the hell.
In all cases, the Block is a real solution to a real problem. We can add more to iOS while making sure people who love what they always had don't see any change. What I would like from Apple is for them to realize this, realize the solutions, but most importantly the problems. They're trying to cram more health and useless little features, find more proprietary gimmicks with very marketable names and constantly living in their little fantasy world. Oh and sending everyone to court too. Don’t add more to your broken structure, fix it! Your experience is missing some crucial elements that is making people leave. Even Windows Phone has useful features added faster than iOS… which is technically the one that created that whole smartphone and mobile revolution.
Come on Apple, remember the good times, the innovation and not iteration era. I remember it, I enjoyed my MacBook Air, iPhone and iPad before the Surface Pro 3 and Windows Phone / Nexus arrived and proved that you became something old. You and Microsoft basically switched sides in terms of innovation and culture. I know that you don’t want to disappoint the grandfather who's having problems with technology, yet understands his iPhone, but in the process you’re disappointing people like me. I gave you a solution to get me and the rest of the nerd squad and Apple lovers back!
Let’s see what you got in three days for WWDC 2014!
You can download all of the JPEGs in better quality right here.
You can also check the links on the side (or top for mobile) for my Twitter, Facebook page and YouTube channel!
Jay Machalani
UX/UI & Branding Architect
2014
Thanks to Tom Warren from The Verge, users from The Verge forums for the help,
My good friend Olivier Grondines for the help while filming,
Catherine Francoeur, David Duclos and Michael Archambault for the feedback!
The wallpaper featured is still “Blue Mountains” from the great Jan Thoma. You can find it on InterfaceLIFT.