Codea’s iOS Menu Bar

Thursday, 10 January 2019

Simeon, co-creator of the amazing iPad coding app Codea:

Codea is our iPad app for creative coding. I’ve been developing a universal version for some time.

It’s hard to take a complicated, eight-year-old iPad coding environment and bring it to iPhone. There’s so many damn features that need to work in so many damn configurations.

Autolayout takes care of many of these issues (thanks, SnapKit). But it doesn’t take care of the most important: design. I’ve been stuck on the design for a universal version of Codea’s code editor for over a year. It might even be two.

I realised six months ago as I was using my Mac, using the menus, that I need these things — menus — in Codea. I was trying to solve a problem that has been solved for decades.

So I set out to make the best menus I could make for iOS.

Do not miss their follow-up post, which has several videos showing their menus in action. Fantastic attention to detail in how they look and feel.

Here’s something I wrote at the end of my piece on Undo in iOS last month:

What it comes down to, I think, is that the menu bar has become a vastly underestimated foundation of desktop computing. Once heralded, the menu bar is now seen as a vestige. I’m not arguing that iOS should have a Mac-style menu bar. I’m simply pointing out that without one, iOS is an 11-year-old platform that is still floundering to establish consistent conventions for some basic features, let alone complex ones, that are simple and obvious on the Mac.

What they’re doing here with Codea isn’t just putting the Mac menu bar on iOS. They’ve designed and built a very iOS-looking take on a menu bar, deeply informed by the aspects of the Mac menu bar that do work on a touch screen. Something like this is desperately needed as a standard interface element on iPad, and I think could work on iPhone too.

(As an aside, looking at the nice drop shadows behind Codea’s menus reminds me how much I hate the almost-no-shadow flatness of standard iOS popovers on iPad. Ever since iOS 7 I’ve thought iPad popovers look like a rendering bug or an early prototype. Putting aside a debate regarding the overall flatness of iOS 7–12, iPad popovers just look wrong to me. They should look a lot more like what Codea is doing with their menus.)