Archive for the ‘iPhone App Design’ Category

Quartz Composer key to iOS 7 design

Thursday, July 18th, 2013

HoursQuartzComposer

A couple rough animations I mocked up using Quartz Composer. Ironically, less-real-worldy elements make it easier to animate in dynamic, fluid, and, yes, physical ways.

iOS 7 has made us totally rethink many of our apps. Of course the aesthetics needed to change, but as designers we should never stop there. The new OS brings amazing opportunities to engage the user even more emotionally through some really cool new APIs.

One of the new things in iOS 7 is a built in physics engine and a new focus on interactions and animations. As designers, that is super exciting to us. Unfortunately, traditional design tools like Photoshop lack the ability to flesh out these kinds of new interaction ideas. Photoshop is built for static mockups. That doesn’t cut it any more.

breezi_placeit

Fortunately, Apple has built a really neat tool called Quartz Composer (requires developer login) that makes it possible to play around with animation. I have always known about Quartz Composer but never gave it a chance due to the steep learning curve. With iOS 7, though, I really had no choice so I finally started diving into this week. Though many people have said it is a “dying application” (and it may be) it is nonetheless an incredibly useful tool and perhaps the best way to design animated interactions at the moment.

Quartz Composer tutorials are scarce but here is a nice set of video tutorials on creating Facebook Home using Quartz Composer by Dave O Brien. These give you enough of an idea to get started. I might actually work on some tutorials myself so stay tuned.

Hours is coming along beautifully and we cannot wait to show you more! If you want to stay in the loop, signup for the Hours mailing list below and take a peek at my Dribbble because I post stuff there quite often.


Christain

My massive Languages case study

Friday, July 5th, 2013

LanguagesCaseStudy

One of the primary reason I’ve been pretty quiet on the blog for the past few months is that I’ve spent the majority of my writing time on an extraordinarily detailed case study about the makings of Languages. It’s chalked full of beautiful photography thanks to my amazing wife and hopefully contains some valuable lessons about making apps.

Though it was published yesterday, I was pretty sure you had better things to do than to read my article on the 4th of July so I am announcing it here and now instead.

Link: Smashing Magazine: Tale of a Top-10 app, part 1: Idea and Design

p.s. I am dedicating most of next month to creating some high quality app making courses. Get on the mailing list to be the first to know more.

Video: The Elements of a Killer App Idea

Wednesday, July 3rd, 2013

Screen Shot 2013-06-26 at 6.14.12 PM
Wow, my last article was quite a wild ride. It went something like this:

Fail

I was quite happy to see it being linked up by lots of nice sites… then it hit #5 on Hacker News, went viral, and absolutely obliterated my servers for 3 hours. My Host Gator Baby plan wasn’t prepared for 30,000 people rushing to the site in a short period of time. I’ve got that on my to-do list.

(Oh and I’m pretty sure the only reason my last article went viral was because of this… Thus, the use of another GIF here. I’m sorry.)

It also made me realize I should probably post a little more to the blog.

So without further ado, I thought I would post a talk I gave at MMConf in Krakow, Poland. I hadn’t seen too many people talking about what exactly makes up a great app idea so I thought I would tackle that in this talk.

The key? You Duh Interface Money Vacuum. To decode that sentence, you’ll need to watch the video. Enjoy!

Jeremy Olson – The Elements of a Killer App Idea – Mobile Mobile Conf 2013 from MMConf on Vimeo.

If you enjoyed the video, please feel free to share it… but even more, make sure to get on our mailing list because pretty soon I’ll be announcing some full-blown online courses where you’ll hear not only from me but the best app makers in the industry about how to build successful apps.

And I’ve made it ever so convenient to sign up…


Responding to iOS 7

Wednesday, June 26th, 2013

hourscontrast
iOS 7…

Some of it looked incredible. The parallax effects, zooming user interfaces, and advanced physics got me excited about the possibilities for new, unexplored user interface ideas.

But man, those icons…

Borderless buttons!?

I understood the move away from leather stitching but wow, now realistic ornaments are suddenly of no value whatsoever?

Like many designers, my reaction to iOS 7 went something like this:

iOS 7 Reaction
Via Hossam Hassan

But we’ve all had an earful from whining designers so I won’t go down that path. I promised myself that I wouldn’t judge the UI until I’ve spent at least a week or so using it regularly.

Despite my initial fears, I actually really enjoy using iOS 7 on a daily basis. I still have some complaints about several visual design choices but you have to remember, Apple has only been working on this for a matter of months. That’s pretty insane. I mean, it takes us at least a year to put out a single app, let alone an entire operating system!

So give them a break. I talked to a number of folks at Apple. They understand that this thing isn’t finished yet and they want our feedback (feel free to email me and I’ll pass it along). It’s only going to get better.

Now, to the pressing question…

How do we respond to iOS 7?

Answering this question may very well play a large role in the future success or failure of indies around the world over the next few years, so it’s important to talk about. Based on my conversations with folks at Apple and leaders in the app community, I’ll lay out a few thoughts.

We have work to do
  • Apps built on top of the iOS 6 skeleton, with lots of gradients, bevels, and realistic details — apps like Tweetbot and Grades — look heavy and out of place in iOS 7. That’s just a fact.
  • No doubt, apps that embrace Apple’s paradigm shift will have an edge over apps that don’t. Apple will more likely feature them and users will more likely download apps that fit in. Evolve or die.
  • I think Marco Arment’s attitude is a good one: this is the single biggest opportunity iOS developers have had since the App Store launched. Every category is up for grabs once again.
But… as always, innovation is what matters

Hours-Main3
Just for kicks, an early mockup that completely mimics iOS7′s default design language.

  • Winning apps won’t merely take Apple’s default look and mimic it. Think about how boring it would be if all of our apps looked like iOS 7 Calendar or Settings. It would get old really fast. But that’s nothing new. Think about if all the apps on iOS 6 looked like iOS 6 Calendar and settings… Yep, it would be really boring.
  • Apple realizes that the diversity of styles on the App Store is one of their strong points and hopefully that won’t change on iOS 7.
  • The best iOS 7 apps will take Apple’s new governing principles of clarity, depth, and deference, and interpret those principles in a unique way. They will innovate on top of the platform just like the best iOS 6 apps did.
  • Designing for iOS 7 will mean much more than merely adjusting your visual style. Although I think we should try to give our apps a unique look through subtle twists on the iOS 7 design language, I’m excited to focus more on making our apps unique by experimenting with novel interaction models, transitions, and physicality, making our apps a lot more visceral. Since iOS 7 is more focused on these kinds of interactions, I think the best designs will innovate in those areas. That might mean us designer types might need to start learning a thing or two about Xcode.
  • Don’t throw away all thought of metaphor and realism. Both minimal and realistic interfaces are tools in our toolbox and we need to focus on making the best experiences for our users. Fitting into the iOS 7 environment is part of that. Realistic-leaning apps on iOS 7 will be different than realistic-leaning apps on iOS 6. I don’t know how exactly but that’s something we’ll be figuring out as the platform continues to mature and users seek more unique and delightful experiences. Some people really like realistic interfaces and I don’t think they are going away forever, despite being somewhat out of style.

Redesigning Hours

hoursui-ios7_1x
Redesigning Hours has been a ton of fun. We have only just gotten started but removing visual noise has allowed us to focus on some interesting interaction issues that we hadn’t thought of before. Simplifying buttons allows us to also do some really interesting animations and transitions, making for a more visceral and fun experience.

I still like the old design and can’t say that the iOS 7 version is necessarily a huge improvement in the visual department, but thinking about the principles of iOS 7 design has sparked breakthroughs that will definitely make Hours a better app over all.

That’s exciting.

We would love to get your feedback so feel free to comment here or on Dribbble.

If you are interested in seeing what we come up with, feel free to sign up for our mailing list:


UPDATE: I’ve started a Branch discussion to try to generate some more discussion among app makers.

Going full-throttle on Hours

Monday, March 25th, 2013

HoursUI2
Just a quick update. We’ve had to put Hours, our time-tracking app, on the back burner for a bit due to other priorities but I am pleased to announce we are now going full-throttle both on the design and the programming. Would love any input on our latest mockup of the main screen.

Tracking billable hours is a pain. We are going to change that.

Stay tuned by signing up to our mailing list: