Welcome to the slightly belated 2nd edition of ‘What I…’
Due to the weekend and a lot of last-minute polishing that had to happen for Briefly 2.0, I had to delay this post a little 😉

Now, without further ado, here’s What I…

… Did

Transloader 2.2 (click)
I released Transloader 2.2 (for iOS, the Mac app remains unchanged for now) and it received a very nice response with a sponsorship on TekRevue, the release on ProductHunt, Beautiful Pixels, and many others.

Received Eternal Storms Software & charity:water T-Shirts (click)
After a long wait, they finally arrived and they look awesome 🙂

Open Source: Animate a determinate NSProgessIndicator (click)
A category on NSProgressIndicator that makes it easy to animate its -doubleValue.

Briefly 2.0
I finished up Briefly 2.0 and submitted it to the Mac App Store, it will be available on June 8th.
Alexander Käßner, the designer who worked on the UI of the app, did a wonderful job and I can’t wait to be able to finally release it next week.

The functionality of the app was completed two, three weeks ago, so these last weeks went into making the app really shine, fixing bugs, polishing the interface and animations and testing all around.

… Downloaded

Sword of Xolan IconSword of Xolan (click)
“Sword of Xolan is an action platformer game that includes the juice of pixel art style. Xolan is a young and brave man who fight for justice no matter what the cost.”
A pretty awesome game and at $0.99 an absolute steal. Very entertaining and well worth the money.

 

Lara Croft: Relic Run IconLara Croft: Relic Run (click)
“Lara Croft: Relic Run is the all new action adventure for nostalgic Lara Croft fans. When a shadowy conspiracy threatens the world, only Lara Croft is equipped to unearth the truth.”
It’s not much different from other endless runners, but it’s well done with a couple of nice animations.

… Read

Beat Detection Algorithms (click)
Working on Briefly 2.0, I had this idea of automatically timing photos based on the beat of a given audio file. It didn’t make it into the upcoming release, but perhaps in a future upgrade. This is non-trivial stuff 😉

‘Big Indie’ Kickstarters are Killing Actual Indies (click)
An interesting article about how ‘Big Indies’ asking for less than they actually need kill actual indies who ask for what they need by ‘devaluating’ game development.

MacDevWeekly #9 (click)
a curated collection of OS X developer code, resources and tools – Issue #9 features NSView-ESSViewCategory by yours truly – a category on NSView to easily create zoom-transitions between two NSViews.

… Watched

My girlfriend is a fan of mangas and animes, so we watched

Nisekoi DVDNisekoi (click)
“Nisekoi follows high school students Raku Ichijo, the son of a leader in the yakuza faction Shuei-Gumi, and Chitoge Kirisaki, the daughter of a boss in a rival gang known as Beehive.”
It’s very funny, my girlfriend and I laughed throughout so if you’re a fan of anime and looking for a laugh, I suggest you give it a try 🙂

… Ate

Butter ChickenIndian Butter Chicken
We’re totally into indian food and butter chicken might be our absolute favorite.

… Went to See

View from the south tower of St. Stephen's CathedralView from the south tower of St. Stephen’s Cathedral in Vienna, Austria
My girlfriend and I haven’t been up there in the longest time, so we decided to walk up the 343 steps – the view was definitely worth it.

Read more

I’m not sure if I’m imagining things, but I believe at some point before OS X Yosemite, a determinate NSProgressIndicator was able to animate to its new doubleValue, not just “jump” to it.

In an effort to have that animation again, I wrote a little category on NSProgressIndicator that does exactly that, using NSAnimation.

Progress bar animation using ESSProgressIndicatorCategory

NSProgressIndicator and Animation

NSProgressIndicator has a method called -startAnimation:. However, as the documentation states, this has no effect on determinate progress indicators.
Calling progressIndicator.animator.doubleValue = 5.0; doesn’t animate either. So with options that come with the class, we’re stuck.

As I try not to reinvent the wheel for something that’s already solved, I did some googling around, but that didn’t yield any results, either.
What became clear, though, was that there’s a lot of confusion about what -startAnimation: actually does.

NSProgressIndicator+ESSProgressIndicatorCategory

Not finding a solution on the internet, I decided to write my own, as I figured it wouldn’t take a lot of time (it didn’t).

I definitely didn’t want to subclass NSProgressIndicator and override any drawing methods.
That would have a) taken an unjustified amount of time and b) been a huge pain in the neck for sure.

The solution to me then was to use NSAnimation.

The goal was to have one method to call that sets the new doubleValue and animates to it nicely:

New method to animate a progress indicator's doubleValueThe category’s – (void)animateToDoubleValue: method

It calls a subclass of NSAnimation named ESSProgressBarAnimation with the new value and starts the animation.

initialization of the NSAnimation subclassInitializing the NSAnimation subclass ESSProgressBarAnimation

We save the original doubleValue of the progressindicator, set the duration and animationCurve and set the animation’s animationBlockingMode to NSAnimationNonBlockingThreaded so that when there’s a mouse event, for example, the animation doesn’t stop.

NSAnimation's setCurrentProgress method

When an NSAnimation object’s -startAnimation method is called, it automatically calls -setCurrentProgress: on itself until currentProgress is 1.0, meaning the animation has ended (currentProgress ranges from 0.0 to 1.0). The value is based on the duration and the animationCurve.
In this overridden method, we calculate the delta between the new and the initial doubleValue of the progressIndicator, multiply it by currentProgress and send it to the progressIndicator. That’s it.

How To Use NSProgressIndicator+ESSProgressIndicatorCategory

Add the category’s .h and .m files to your project, import it where you need it and update your progress indicator’s doubleValue by calling -animateToDoubleValue: with the doubleValue you desire to animate to.

The Source Code

The repository (a sample OS X app) is available on Github.

It was developed (and tested) on OS X Yosemite 10.10.3 using Xcode 6.3.1 but should work on earlier versions of the operating system.

More source code is available here (or directly on my github profile page) if you’re interested. If you have any questions or feedback regarding my open source projects, please be sure to mail or tweet me – I’m looking forward to your feedback!

Enjoy!

Read more

You know how they say it’s good to keep a journal of things you do to see how far you’ve come, what you’ve achieved, where you’ve been, etc (the raison d’être for DayOne).

I’d like to try something new and decided to do just that here on my blog to keep a reference for my future self and for everyone else who’s interested.

What I…

… Did

Briefly 1.6 (or 2.0, haven’t decided yet; work in progress) (click)
I got a lot of work done on the next update for Briefly. Especially the new soundtrack option trimming (with a neat audio wave form) took a lot of time and only now is done. But I’m pretty proud of how it turned out and it was well worth the time investment.

Briefly's New Audio Wave Form

The Audio Wave Form View (aka ESSAudioWaveView, a separate blog post will follow) makes heave use of the AVFoundation framework for creating the audio wave form (AVAssetReader), playback (AVPlayer) and actual trimming of the audio asset (AVAssetExportSession) (which will not be used in Briefly, as the app already has a system in place for trimming and fading out the audio for the still motion video. Why implement it then? For completeness. I might use it in a different project and it might come in handy there. Plus, trimming is kind of the point of this view. In Briefly, however, I only use the range the user selected in ESSAudioWaveView and pass it into the system already in place).

Quartz 2D / Core Graphics (mostly NSBezierPath) is used to do its drawing, NSAnimation for the couple of subtle animations (fading in/out the timing information, moving the selection markers).

I also implemented Undo support, using NSUndoManager (a separate blog post will follow). It was far easier than I had anticipated – I only ever used it once in a private test project and it was a complete mess. But I was so much older then, I’m younger than that now. I’m sure there’s more complex scenarios, though. In ESSAudioWaveView, undo is supported for selections and zooming into them enabling more fine-grained selections. Undo comes in very handy when trying to find the right selection for later trimming. And because I had an animation system in place, all undos (except for zooming into/out of a selection) are animated, which makes it look more polished.

This upcoming new version is a major overhaul of the app, as it will also allow users to save their projects, opposed to the “one-shot” approach the app had until now.

Transloader 2.2 (Waiting for Developer Release) (click)
The next update for Transloader will bring a fix for iPhone 6 Plus and add a “Add to Transloader” button to Transloader’s Today Widget if a link is on the clipboard.

Transloader

This will make the app even more useful (in addition to the Action Extension accessible from the browser, which was part of the 2.1 update).

Website Branding, Corporate Identity (blog post)
I redesigned my website, this blog and plan to update my apps so they have a great new About – window (see the blog post linked above). The first to have it will be the next update of Briefly, but it will roll out to all my other apps as well.

SPRITEplayer (private project for my brother)
My brother is dead-set on developing a 2D adventure game. He needed an app to test his sprites and backdrops together, so I whipped up this app for him. He can add backdrops and sprites, scale them, change the speed of the character animation and make it move around by dragging the mouse. Bare-bones, but it gets the job done.

SPRITEplayer playing a sprite

I wish I had had the time to do it in SpriteKit. It would have been a perfect fit. But as I didn’t have the time to dive into a whole new framework I am not familiar with, I simply used two CALayers (one for the backdrop, one for the character/sprite) that draw an NSImage into their bounds rectangle and NSTimer for the character animation (which basically only increases the index of the character image to be drawn). Not much to it.

Open Source Code: ESSProgressIndicator (blog post; github)
ESSSquareProgressIndicator animating
I already blogged about this, so I’ll be quick – I open sourced an indeterminate, square progress indicator, developed for the iOS game Reach ZEN.

Open Source Code: Zoom-Transition between NSViews (blog post; github)

zoomtransition.gif

Another Open Source Project I already blogged about – this lets you easily transition between two NSViews with a nice zoom-animation as seen in OS X 10.10.3’s Photos.app.

… Downloaded

Torchlight 2Torchlight II (Mac)
I finally purchased Torchlight 2. I missed the release-sale when it was released for Mac so I waited for another sale, and sure enough, last week, it was on sale for $4.99 on the Mac Game Store. I loved the first game (although once you were done with the campaign, it got stale pretty rapidly), so to get the second game was a no-brainer for me. I don’t have a lot of time to play, but what I’ve seen so far, I like.

Review Times IconReview Times (Mac)
My fellow Austrian Frank Gregor (@thecocoanaut on twitter) recently released his app Review Times that puts a display of how long it’s currently taking Apple on average to review apps on the Mac- and iOS App Store (based on data from appreviewtimes.com) in the menu bar and Notification Center (which I prefer, as my menu status bar is terribly crowded).

OS X 10.10.3 with Photos.app (Mac, duh)
I know, everybody downloads that one. But I thought I’d take the opportunity to quickly jolt down some notes on Photos.app. It’s especially interesting to me as I work on two photo-apps, flickery and Briefly. It’s very responsive, compared to iPhoto (I never used Aperture, aside from quickly testing flickery’s plugin for it from time to time). The interface is very clean with a clear, uncompromising focus on the content. I’ll be taking some clues from it for flickery 2.0 for sure.

What I didn’t like was the import process from iPhoto. I started off with a clean slate first for Photos.app (it started downloading photos from the iCloud Photo Stream immediately – plus points). But for an app that’s supposed to replace iPhoto (and Aperture), it’s surprisingly obscure to import the iPhoto library. The Import… menu item doesn’t help, it’ll only import photo and video files as far as I could tell, I couldn’t select the iPhoto Library, which was very odd to me.

What you have to do is press the option-key on your keyboard during launch. Yes, that’s very user-friendly (not). Then it takes the iPhoto library and turns it into a Photos.app library. And after that, you’re not done. Because for some reason, iCloud Photo Stream and iCloud features in general are disabled by default. You have to dig into Photo.app’s preferences to finally see that you have to make your newly created Photos.app library the default library for iCloud to work (why wouldn’t it be when I import all my iPhoto photos. And if it isn’t, why not ask me right away after the import?)

Borders around Buttons in Photos.appAlso, I find the borders around these buttons kind of weird. And they are only visible if there’s something blurred in the background.

Apart from that, I think the app is very well done and I haven’t had any trouble since. I like the icon, too. Would be nice if it imported Photo Booth’s photos, too.

… Read

The Gemini Program Book CoverBook “Das Gemini Programm”
In a fit of “I have to learn something about the Space Program”, I ordered a couple of books about Gemini and Apollo. The book is very interesting, albeit extremely technical, which I hadn’t anticipated.

Link: Writing a Great App Store Description (click)
App Store Descriptions are extremely important, without a doubt. I’m always trying new things to improve mine and this article has some interesting pointers of places of improvement.

Link: Create Space Invaders with Swift and SpriteKit (click)
Before I started work on SPRITEplayer for my brother (see above), I thought of implementing it on top of SpriteKit, as it definitely would be a perfect fit. However, for a side project that had to be done very quick (as I kept postponing for quite some time before actually doing any work) I didn’t have the time to learn a new framework. But if his game does make some progress and I do the programming, that link will come in very handy.

Link: Is Deus Ex Still the Best Game Ever (click)
I am a huge fan of (the first) Deus Ex and indeed think it’s the best game ever. I only played the first and the newest part (Human Revolution as of this writing).

… Listened To

Inquisitive Podcast #35 – Behind the App: Working with the Press (click)
I usually don’t listen to podcasts much, but this one interested me and is well worth 45 minutes of your time if you need to work with the press ;), featuring Federico Viticci (@viticci on twitter) of MacStories.

… Watched

PK Movie PosterPK (India 2014; Aamir Khan, Anushka Sharma) (click)
My girlfriend turned me on to Bollywood and I must say, I enjoy it quite a lot. It’s something different for a change. PK is about an alien (Aamir Khan) coming to Earth. A stranger robs his space ship remote control without which he can not get back to his home planet. So he has to adjust to life on Earth to retrieve it. People tell him he just has to turn to God and pray and he will receive what he is looking for. Not having a notion of what God is, thinking God is a person, he goes around and starts handing out Wanted-signs. A movie that has a nice message to make you think, and funny songs with dance numbers.

Rosemarys baby posterRosemary’s Baby (USA 1968; Mia Farrow, John Cassavetes) (click)
I’m probably late to the party, but I finally watched it. I found it entertaining, but it’s not a horror movie by today’s standards. It’s very creepy, though. The neighbors, the house, the husband… The scene I cringed the most was where Rosemary eats raw chicken liver. Eew. I rented it on AppleTV (the first time I did that) and it works very well. No hassle what-so-ever. Very enjoyable experience.

… Ate

Chicken Curry with Rice, NaanChicken Curry with Rice, Naan. Not as spicy/hot as I had feared.

… Went to See

Kurpark Oberlaa FlowersKurpark Oberlaa, a nice park at the edge of Vienna

Simmering Water ReservoirWater Reservoir Simmering, a new project to combat floods

Read more

For Briefly, I needed a nice, subtle animation for switching between the detail soundtrack view and the reorderable list view. In OS X Yosemite 10.10.3’s Photos.app, I noticed something I liked very much.
When going into an album, for example, the current view is zoomed out of focus and the new view is zoomed in.

Zoomtransition Animation Gif

NSView+ESSViewCategory

I wrote a little category on NSView to do just that, it’s a one liner (ironically, in this pic, it’s more than one line) :

Line of code

It’s pretty self-explanatory. You pass in the view you want to transition from and the one you want to transition to, the type of transition (zooming in or out), the duration and an optional completionHandler that’s called when the animation ends.

Alternatively, it’s also available as an instance method where the view you call this on will be passed into the class method as fromView:

Instancemethod

The Views

For the transition to work, fromView has to be in a view hierarchy, toView shouldn’t. They should be the same size, otherwise more work on your part is necessary (which I had to do in Briefly because the NSPopover the views reside in resizes before / after the transition), but either way the code provided should give you a nice head start.

fromView’s superview is temporarily set to have a CALayer to make use of Core Animation during the transition. After the animation ends, the superview’s wantsLayer – state is reset to what it was before the animation. If we didn’t do this, the animation would appear sluggish.

ESSViewZoomTransition

As you can see in the gif above, there are two types of the transition:

– ESSViewZoomTransitionZoomOut – the transition from the textView to the view with the checkboxes.
– ESSViewZoomTransitionZoomIn – the transition from the checkbox-view to the textView

How To Use NSView+ESSViewCategory

You’ll have to first add the NSView+ESSViewCategory.h and *.m files to your project.
Please note that the category imports <Quartz/Quartz.h> for Core Animation’s CAMediaTiming class, so you might have to add that framework to your project, too.

fromView
It has to be inside of a view hierarchy. Fades out during the transition.

toView
Can be in a different xib file (for example, a NSViewController) or in the same as fromView. It’s important that it is not already on screen somewhere. Fades in during the transition.

Once you have set up your views, either call the class method and pass fromView and toView as well as the other parameters or call the instance method on fromView.

How It Works

The method creates an NSImage of both toView and fromView, puts them into two NSImageViews that have the same frame as the views and animates those two NSImageViews accordingly (calling imageView.animator.frame = …; and imageView.animator.alphaValue = …; )
Because fromView’s superview temporarily gets a CALayer, .animator is powered by Core Animation, which makes for a much smoother animation than doing the same without a layer-backed view.

ImagecreationCreating an NSImage of toView.

So the views themselves aren’t actually resized, they’re just screenshotted, removed from view as we place the NSImageView on top of it, creating the illusion that nothing happened. Then we animate the NSImageViews and insert toView after the animation is done, removing both NSImageViews.

The Source Code

The repository (a sample OS X app) is available on Github.

It was developed (and tested) on OS X Yosemite 10.10.3 using Xcode 6.3.1, but should work on earlier versions of the operating system.

I have some more source code available here (or directly on my github profile page) if you’re interested. If you have any questions or feedback regarding my open source projects, please be sure to mail or tweet me – I’m looking forward to your feedback!

Enjoy!

Read more