Portfolio to Go for Flickr

Portfolio to Go for Flickr has just been approved for sale by Apple and is now availabile for iPad on the App Store.

A recent winner of Apple’s ‘iPad App of the Week’ award, Portfolio To Go features an elegant and intuitive photo-wall giving users instant access to all of their Flickr photosets: scroll each gallery horizontally to browse thumbs, scroll vertically to traverse through all synced galleries.
The main purpose of Portfolio To Go is to enable photographers to present their portfolio offline to clients – perfect for use with iPad wi-fi: just sync and go. Photographers create and edit photosets on Flickr.com and Portfolio To Go acts as a presentation tool, keeping in sync with all your Flickr changes.

Portfolio To Go supports all iPad rotations so can be flipped vertically for portraits and horizontally for landscapes.

Another unique selling point of this app is the ‘Send Portfolio to a Client’ feature. The Photographer picks and chooses which of his galleries to share and can then send an auto-generated email to clients and friends containing a free download link to ‘Portfolio To Go Player’ iPad App. By clicking the emailed link clients launch the photographer’s portfolio on their own iPad(s).

[flickr album=72157624609630073 num=30 size=Small]

Check out this great video review of Portfolio To Go on iPad. Mark Wallace from Adorama TV takes you through most of the key features of the app :-)

Key Features

# Photo Wall:
View all your Flickr photo galleries at once – scroll each gallery horizontally to browse thumbs, scroll vertically to traverse through all synced galleries. Click on any thumbnail to jump into the main image view.

# Main image view displays gallery thumbnails to enable intuitive gallery navigation. Just click the main image to go full-screen.

# Flickr Authorization: access to all of your private, friends and family and public photos

# Multiple cached portfolios: add unlimited Flickr portfolios via your contacts or Flickr IDs to P2G and switch between them.

# Auto-cache photos: all photos get cached in the background while you browse (you can turn this feature off in settings)

# Send Portfolio to a Client: Pick and choose which galleries to include and then send your portfolio straight to clients and friends by email from the app. Clients will download the free Portfolio to Go Player app to their iPad and launch your portfolio from the emailed link.

# Share your photos and Flickr links via Facebook, Twitter or Email

# Save favourite Photos to your iPad Photo Library

Portfolio To Go goes Pro!

Portfolio to Go for Flickr has just been approved for sale by Apple and is now availabile for iPad on the App Store.

Following the success of Portfolio To Go Lite – a top 10 free iPad App for Photographers – this pro version adds many new features including:

  • Photo Wall:
    View all your Flickr photo galleries at once – scroll each gallery horizontally to browse thumbs, scroll vertically to traverse through all synced galleries. Click on any thumbnail to jump into the main image view.
  • Main image view displays gallery thumbnails to enable improved gallery navigation. Just click the main image to go full-screen.
  • Pick and choose which galleries to display and which to hide
  • Share your photos and Flickr links in app via Facebook, Twitter or Email

Apple has chosen to feature Portfolio to Go for Flickr in the new and noteworthy section of the iPad Photography category – they did the same for the Lite version :-)

W.A.Ellis Property: iPhone App

Built for Property specialist digital agency World Archipelago, I was supplied with the customized design and commissioned to build a reskinnable iPhone property app that can be added to WAI’s range of online solutions for their extensive range of Real Estate Agencies.

Here’s a live version for Estate Agency Halls:

The app includes the following features:

  • Auto-paginated property search
  • User-location finding for local property searches
  • Auto-saves recent search requests
  • Saved property list between sessions
  • Property location display on a map
  • In app email property to a friend
  • Property details image gallery
  • Cached thumbnails

With additional functionality such as previous/next property buttons directly from within each property page this app is a great solution to most estate agency requirements. A robust, optimised and elegant-looking iPhone property app.

Introducing Loop&Learn!

After 5 months ‘ad hoc’ development and a short but anxious 6  day wait in the Apple submission queue we have finally launched our ‘Social Learning’ App for iPhone, iPad and iPod Touch: Loop&Learn.

Loop&Learn is more than just ‘my best ever iPhone App’, it is my best ever app… desktop, web, mobile or otherwise. It is both technically and content-wise the coolest software I’ve been lucky enough to develop.

Learn Chinese Phrasesloop-study-birds
Whether you want to learn Chinese or are an avid bird watcher,  there’s a loop for that :-)

Here’s my business partner, Neil Gerstenberg, presenting our app on YouTube:

As Neil describes in the video, Loop&Learn is a tool to help you learn ANYTHING! Right on your iPhone you can create multimedia ‘Learning Loops’ consisting of recorded audio phrases, images and text. On iPhone and iPad the audio recording works directly from the device microphone. On iPod Touch you’ll need a compatible microphone earphones for authoring but all of the study and learning loop playback is compatible without any extra hardware.


We’ve designed the authoring process to be as intuitive as possible with features such as:

  • body text is auto split into loop phrases based on line/paragraph breaks – so you can easily import large learning texts into the app
  • auto-record in the phrase editing screen detects silences and enables you to split up your multiple audio phrases without continuously clicking a record button
  • the full current paragraph text is instantly displayed when recording each phrase
  • while editing body text the app enables users to play the existing audio phrase associated with the current text cursor position

Loop&Learn AuthoringBody Text Editor
New/Edit Loop Home Screen and Body Text Editor

Loop&Learn AuthoringLoop&Learn Authoring
Phrase Record and Edit


Likewise, in study mode here are just a few handy learning features offered by our app:

  • multi-gesture control: double tap to start/stop playback, swipe left and right for next/prev phrases, swipe down and up for next/prev looping groups
  • single or multi-select the loop blocks at the top of the screen to split your learning into looping bite-size chunks
  • 2 learning modes: ‘Repeat with me’ and ‘Listen’n’Repeat’ – the latter plays the full loop group and then repeats silently giving you the chance to repeat aloud


Saving the best for last, my favourite feature of Loop&Learn is the new collaborative learning concept it introduces: ‘social learning’.

Users of our app can share the learning loops they create via our ‘Loop Library’. All that’s required is an account with Twitter.  Once a user shares one or more of their learning loops they retain ownership of the loop and can change and update it at any time via the same share and update process.

Loop Libraryshare-on-twitter

Think of the amazing possibilities that social learning offers. Language learning for example: User A is French and wants to learn English, User B is English and wants to learn French. If User A and User B create and share language loops in their native tongues then they both will benefit from the shared content!

In anticipation of launch, Neil, myself and friends have created some example loops that demonstrate how versatile the app is. Take a look at the Featured Loops page on loopandlearn.com. You’ll find learning loops for:

Just a few of our examples to kick off the app. As more people purchase Loop&Learn we expect the content to grow and it will always remain free to download user generated loops so the loop library should get bigger and better :-)

Thanks to the power of Twitter when users share new learning loops Loop&Learn sends a tweet with a link to the newly created loop preview page on our site. Like this one for example: http://www.loopandlearn.com/9ddbb9

what’s really cool is that on the top right of that preview page is a download link which when clicked on by Loop&Learn users via Safari or most iPhone Twitter clients Loop&Learn will automatically:

  1. launch on the  iPhone
  2. download and install the loop being previewed

The Website

www.loopandlearn.com stays up-to-date automatically with the latest learning loops uploaded by Loop&Learn users. We have also launched the site with a ‘Hot Loops’ / Featured Loops section.

Happy Looping!

How to create square thumbnails using iPhone SDK / CG Quartz 2D

Today I wrote a useful Objective-C method which uses Quartz 2D from the iPhone SDK to dynamically generate square thumbnails from any portfolio or landscape UIImage. I failed to find helpful results on Google for the various CGContextClipToRect/CGContextTranslateCTM/CGContextScaleCTM Quartz functions so after a lot of trial and error I managed to get the results I was after with a fairly efficient script – shown below.

So, if for example you want to get a 32×32 pixel square thumbnail, you can pass 32 as the ‘length’ parameter in the function below. For portfolio images the code will take a full square from the original image from the centre using the full width of your original portfolio image. Likewise, for a landscape image the script will use all the height available, clipping the right and left sides.

I think the most import thing I learned when writing this script is that when you call UIGraphicsBeginImageContext(CGSize) make sure that the size you pass in is the size you want your final image to be. Otherwise you end up having to call UIGraphicsEndImageContext() and UIGraphicsBeginImageContext() multiple times with different CGSize instances which I’m sure isn’t an optimised way to achieve the same results.

- (UIImage *)thumbWithSideOfLength:(float)length {

NSString *subdir = @”my/images/directory”;
NSString *filename = @”myOriginalImage.png”;
NSString *fullPathToThumbImage = [subdir stringByAppendingPathComponent:[NSString stringWithFormat:@”%dx%d%@”,(int) length, (int) length,filename];
NSString *fullPathToMainImage = [subdir stringByAppendingPathComponent:filename];

UIImage *thumbnail;

NSFileManager *fileManager = [NSFileManager defaultManager];

if ([fileManager fileExistsAtPath:fullPathToThumbImage] == YES) {
thumbnail = [UIImage imageWithContentsOfFile:fullPathToThumbImage];

else {
//couldn’t find a previously created thumb image so create one first…
UIImage *mainImage = [UIImage imageWithContentsOfFile:fullPathToMainImage];

UIImageView *mainImageView = [[UIImageView alloc] initWithImage:mainImage];

BOOL widthGreaterThanHeight = (mainImage.size.width > mainImage.size.height);
float sideFull = (widthGreaterThanHeight) ? mainImage.size.height : mainImage.size.width;

CGRect clippedRect = CGRectMake(0, 0, sideFull, sideFull);

//creating a square context the size of the final image which we will then
// manipulate and transform before drawing in the original image
UIGraphicsBeginImageContext(CGSizeMake(length, length));
CGContextRef currentContext = UIGraphicsGetCurrentContext();

CGContextClipToRect( currentContext, clippedRect);

CGFloat scaleFactor = length/sideFull;

if (widthGreaterThanHeight) {
//a landscape image – make context shift the original image to the left when drawn into the context
CGContextTranslateCTM(currentContext, -((mainImage.size.width – sideFull) / 2) * scaleFactor, 0);

else {
//a portfolio image – make context shift the original image upwards when drawn into the context
CGContextTranslateCTM(currentContext, 0, -((mainImage.size.height – sideFull) / 2) * scaleFactor);

//this will automatically scale any CGImage down/up to the required thumbnail side (length) when the CGImage gets drawn into the context on the next line of code
CGContextScaleCTM(currentContext, scaleFactor, scaleFactor);

[mainImageView.layer renderInContext:currentContext];

thumbnail = UIGraphicsGetImageFromCurrentImageContext();

NSData *imageData = UIImagePNGRepresentation(thumbnail);

[imageData writeToFile:fullPathToThumbImage atomically:YES];

thumbnail = [UIImage imageWithContentsOfFile:fullPathToThumbImage];
return thumbnail;

So if, for example your original image looked like this:


Using the method above you could request a 100×100 pixel thumbnail which would result in this: