Recreating the new iTunes App Icon

A new version of iTunes was released yesterday with the launch of Apple Music, Apple's new music streaming service.

I loved the new icon design on the iTunes Mac App, especially the colourful gradient, so I took an attempt to recreate it within Sketch. 

Here is the result.

It's not 100% accurate as I couldn't get some of the colours to match exact, but its pretty darn close. Recreating this icon has taught me a little about layering gradients, which is a technique I haven't really used heavily in the past.

Feel free to download the Sketch file and check it out for yourself. 

An hour with Safari Content Blocker in iOS 9

I took a little time out today to watch WWDC Session 511 to learn about how Safari Content Blocking will work in iOS 9 and OS X El Capitan. After an hour, I had a little concept app running. I wont really explain the technical details of how the extensions work or how to create them, that is better done by watching the WWDC Session video directly, but I will say its frightfully easy and the code I used for the blocker detailed below is at the bottom of this page. 

Ok, so the website I decided to try "fixing", is one that I see linked often, iMore. Let me start this by saying I really like the content that iMore provide and enjoy the personas of their staff on their many podcasts (Debug is one of my favourites!), but I hate the experience of their mobile website as it has several ad's by many different providers, all tracking me across all different sites. They have super tiny 'close' buttons that are near impossible to hit, they follow you as you scroll and there is a slow loading full page interstitial that loads on every page refresh. Urgh! Anyway...


Here is a screenshot of before & after the content blocker has run.

Space Grey @3x + IMG_8111.png
Space Grey @3x + IMG_8111 + IMG_8114.png

I don't know about you, but I think this website looks a lot more better now. The content I want to see is there in front of me, uninterrupted and free of clutter.  (note: I dismissed the App Store banner at the top and couldn't get it to reappear for the second screenshot). 



With no content blocked, there are 38 3rd party scripts  (scripts not hosted on the host domain) running when the homepage is opened, which takes a total of 11 seconds. Some of these scripts are hosted by companies I know, Google, Amazon, Twitter and lots from companies I don't know. Most of which I assume are used to display adverts or track my activity, as the network activity was still active after a minute of leaving the page dormant. I decided to turn them all off all 3rd party scripts and see what would happen. 

After turning off all 3rd party scripts, the homepage took 2 seconds to load, down from 11 seconds. Also, the network activity stopped as soon as the page loaded so it should be less strain on the battery. 

I later blocked the CSS div's reserved for ad space and for the rotating carousel at the top as one of the scripts i blocked broke the functionality and I didn't really like it enough to fix it, for details, see the copy of my JSON below. 

Would I block content? 

Now, this was fun little project to mess around with, but it does give me a moral dilemma. Do I care more about my privacy, time, device battery life & data usage or do I care more about the content creators of sites I visit to be able to monetise effectively and ultimately keep creating content?  

Tough question. At the moment, I don't know. 

If anyone wants to play around with my (very limited) Safari Content Blocker Extension, here is a copy of my JSON

Media Icons

Recently I've been trying to improve my design skills (or lack of thereof!). I decided to redesign the basic media controls found in most music apps in Sketch.

I have no real use for these icons, so I've decided to release them as a pack for free. They are fully editable vectors and free to use for personal or commercial projects. Hopefully in the coming months I'll create some more icons to put there. - Learn iOS Design & Xcode

Design+Code is an online course, delivered through text and video, designed to teach you how to create an app from scratch. From design through to mock ups, prototyping and creation of a functional app. 

As someone who enjoys digital design but finds it a natural struggle, it was very empowering to follow along the tutorials in Sketch and see a basic prototype on my phone. When it comes to code, the author, Meng To, does a great job of explaining just enough of the Swift language to get you comfortable to understand what is happening while you follow along. It's also great to see how Meng uses Xcode Storyboards to do quick prototypes for apps without any code. It's so simple, obvious once you see it done, but it had never occurred to me to do it. 

There is also a great community aspect that comes with this course. Meng sends out a weekly newsletter of curated links relating to app creation & design, and there is a Facebook group dedicated to this course, who I have found are very helpful in answering questions and helping each-other out with different aspects of the course and app creation in general.

Design+Code is a unique way of teaching, and to me an effective one. Be sure to check it out at

My OS X Setup - The Toolbar

My OS X Setup - The Toolbar

Following on from my last post about my Dock Icons, here is what I keep up in my toolbar. 

CopyClip - I copy & paste text all the time, so I find CopyClip absolutely essential to keep a history of my pasteboard. 

QuickRes - QuickRes allows you to quickly change screen resolutions with either a click of the toolbar, or a keyboard shortcut. With previous devices I have always used the default resolution. Since getting the Retina Display Macbook I have found myself wanting to toggle resolutions depending on what task I’m doing. Some times I could use extra real estate so I use 1680x1050, the rest of the time, I use the default 1280x800. The maximum resolution is 3360x2100, a little to extreme for me! 

iStat Menus - I have this setup to show 4 key metrics: Network Activity, CPU Usage, Memory Pressure & Disk Space. At a glance, I can get a good visual representation of what my computer is doing along with what applications are causing any unexpected usage.
Fantastical - With Fantastical I’m one keyboard shortcut away to adding a new calendar appointment, or seeing my current schedule. Also the toolbar icon is a nice minimal way to check the current date.

BackBlaze (not pictured) - My favorite cloud backup service. I haven’t setup BackBlaze backups yet on this machine yet, as I am still in the process of migrating over from my old Macbook. Once that is complete, I’ll setup BackBlaze to periodically backup my data remotely. 

My OS X Setup - The Dock

My favourite part of setting up a new computer is installing applications. It's a great opportunity to revaluate what applications you currently use, and try out alternatives.

The Dock is a great place to start, as that is where my most used applications live. 

iTunes - Surprise surprise, I use this for music & movies. I don't store much locally, as most of my music streamed via iTunes Match. Also there are countless movies that I have acquired over the years from iTunes.

iBooks - I've only just started using iBooks on the Mac, mainly for reading documentation, such as The Swift Programming Language. I still don't enjoy reading novels from a laptop, so I stick to my iPad for that. 

Safari - My favourite way to browse the web. I love that Keychain creates, saves and syncs unique passwords for me across the web straight to my mobile devices. More recently, I have ditched my regular RSS reader and Instapaper to make use of Safari's Shared Links and Reading List. So far, it is working well. I especially like seeing links from the people I follow on Twitter show up in-between my RSS items.
Note: RSS Subscription are only available in OS X Yosemite & iOS 8 versions of Safari

iMessages - The main way I stay in touch with people, especially since Yosemite has added support for "Green bubble friends"

Tweetbot - My favourite Twitter client. It syncs my reading spot with its mobile counterparts, along with mute lists.

Sketch - I've always used Adobe's creative suite's for graphic design, but I've never loved using it. I am trying to steer clear of Adobe's software as I've found its very bloated for my simple needs, occasionally buggy, expensive with subscriptions... Basicallly, I don't find myself to be the market Adobe are trying to target. Enter Sketch. A beautiful, lightweight design tool made from the ground up for Mac. It also has an iOS app called Sketch Mirror, which allows you to beam the workspace you are currently working on to an iOS device, great for when working with UI mockups. 

Xcode - If you don't know that Xcode is, chances are you don't need to know, but for the curious, its a tool that Apple releases that allow developers to create rich applications for OS X & iOS. I am currently working with the latest beta, getting deep into the new programming language that Apple released at WWDC earlier this year. My favourite new feature has to be Playgrounds. It is just so fun to use when prototyping segments of code, mainly due to the real time feedback it gives you as you write. 

Home Folder - Ok, so not an application, but it allows me to instantly look at the root of my home folder. 

Trash Can - Such a pretty icon in Yosemite, don't you think? 

Currently Missing: I have yet to settle on a writing application for OS X and iOS. Writer.Pro was my previous favourite, but I am going to do a little research and look for an alternative. A great photo management application is also missing. Over the years I have amassed just over 150gb of photographs, which need a home. I have decided against my previous tool, Lightroom, due to my Adobe boycott, although the alternatives are not much better. Apple's very own iPhoto and Aperture has been discontinued and are due to be replaced by iCloud Photo Library, which I think I will transfer to in future, although there is no OS X app for it yet. 

2014 Macbook Pro - First Impressions

For nearly 6 years my late 2008 MacBook has served me well.

Recently it has started showing its age in terms of performance and stability. It's no surprise, as it has had heavy use of photo editing, music recording, application development, graphic design, countless hours of movies, music and netflix streamed over many years... It needs a break!

I've decided to upgrade to the baseline Mid-2014 13" Macbook Pro with Retina Display (such a mouthful!). I won't do a full on review, as that has been done better and more in-depth elsewhere. What I will offer though is some first impressions on the differences I've noticed compared to 6 year old predecessor.

  • Speed: Everything is just so fast and responsive. I previously fitted an SSD into my old machine, which brought the boot time to around 25 seconds. This new MacBook turns on from a cold boot in under 10 seconds. Great for when I just want to get to work!
  • Sound: Well, there isn't any. The fan is whisper quiet thanks to the asymmetrical blades. Even under a few matches in Team Fortress 2, it didn't make much audible noise.
  • Sight: I have a love/hate relationship with the Retina Display. The amount of detail shown is incredible. The typography looks beautiful, icons shine, and Yosemite renders everything perfectly. However, after switching back to my old MacBook, everything on the screen looks slightly fuzzy due to the lower resolution. The Retina Display is amazing when you are using it, and sucky when you're not. 

That's all I wanted to touch on in this post, although I will give a last minute mention to the weight, dimensions & battery life, it feels light but sturdy and apparently can last for around 9 hours on a single charge which I have yet to test but have no doubts it will. 

Number Tap on the App Story Podcast

This week I was invited to the App Story Podcast to discuss my experiences with Number Tap. Give it a listen if you want to hear about how the app came into fruition. 

If you are not already subscribed to App Story Podcast, shame on you! It's a great show for app fans & mobile developers and has quickly became one of my favorite podcasts to listen to.

"Rate This App"

Most apps ask at the wrong time, they'll prompt users after x number of launches. For example, today I opened Mailbox to check my mail, and boom up pops a "rate this app" dialog. Honestly, I just wanted to check my mail, and had I been a different type of user, I may have said sure I'll rate your app… headed to the app store and left a scathing 1 star review.

Asking for a review on the App Store shouldn't be a sin, but most developers approach it wrong. Dan has highlighted some great effective ways to prompt dedicated users to rate or review your app.