Patrick Rushton

Client: ROC Friesepoort
Format: Flash site, game & map tool

Summary: This site was produced as part of a campaign to recruit students for the ROC Friesepoort schools. Students can signup for an open day or play a game in which they discover which courses match their interests. The school locations which offer the courses are then shown on an interactive map in which the student can find out more about the schools and courses they offer.

Role: I came up with the radar game and map concepts after brainstorming around the central campaign message “dichtbij” which means “close by”. I first created some Flash prototypes to see what was possible using the Google Maps API before developing the interaction design, visual design, sounds and Flash animatics. The final Flash application was created with the help of Actionscript/PHP developer Roy Garnaat who implemented an elegant PureMVC-based framework for the site.

Tools: Adobe Flash, Fireworks, Photoshop, Illustrator, Ableton Live

Client feedback: “I worked with Patrick on an interactive website for ROC Friese Poort (education). Patrick translated the proposition excellently into an effective interactive concept for our target students (14-16 yrs old). He is open to difficult questions and knows how to translate that into improvements of the concept. The world needs more interaction designers like Patrick, who are able to translate strategy into effective and distinctive artwork. Great work, great results!” July 6, 2010

Link: http://dichtbij.rocfriesepoort.nl

Flash & ActionScript, Visual Design, Web & Mobile UX

Client: Bond van Adverteerders
Format: Flash website

Summary: This website was created to present the interactive advertising and research findings of the IDBC. The project has been put forward for a Spin Award and AMMA Award.

Role: Interaction & visual design, video editing & encoding, Flash/ActionScript 3.0 development

Tools: Adobe Flash, Fireworks, Photoshop, JavaScript

Link: http://www.dztv.nl/idbcpilot

Flash & ActionScript, Interactive TV, Visual Design, Web & Mobile UX

Client: Amstellyceum School
Format: Flash game

Summary: This game was developed as part of an online campaign to help recruit 10-12 year old students for this Amsterdam-based school. The theme of the game builds on the schools philosophy of helping students recognise their own potential, as “the school that sees more in you”.

Role: Concept development, graphics design, animation and Flash/ActionScript 3.0 development.

Tools: Adobe Flash, Fireworks, Illustrator, Apple Soundtrack Pro

Link: start game

Flash & ActionScript, Visual Design, Web & Mobile UX

Client: Inova Fruit
Format: Online viral campaign

Summary: Rubens is a brand of apple grown and marketed by the fruit producer Inova. In order to grow their customer database, this online game was created for users to compete for a chance to win a bungalow in a Landal Greenparks holiday park.

Based on the Ruben’s theme of “Enjoying together”, users can send invitations to their friends who they would like to join them in their holiday bungalow. Filling as many bungalows as possible increases the users chance of winning a prize. The viral nature of the game has lead to an extremely successful campaign with thousands of new users joining in.

Role: concept development, interaction design, illustrations & visual design

Tools: Adobe Fireworks, XHTML, CSS

Press: VakbladAgf: Rubens-appel weer in agf-schap

Visual Design, Web & Mobile UX

Client: Canals of France
Format: Web landing page

Summary: This concept was created to market a recipe book authored by a company which runs luxury barge cruises in the South of France. The page layout is inspired by the classic AIDA marketing model which describes a common list of events that are often undergone when a person is selling a product or service:

A – Attention (Awareness): attract the attention of the customer.
I – Interest: raise customer interest by demonstrating features, advantages, and benefits.
D – Desire: convince customers that they want and desire the product or service and that it will satisfy their needs.
A – Action: lead customers towards taking action and/or purchasing.

Tools: Adobe Photoshop, XHTML, CSS

Visual Design, Web & Mobile UX

Client: CHANCE for Nepal
Format: Web site

Summary: This website for was designed to reflect the non-profit organisation’s values and get their message across to existing and prospective sponsors in a clear and simple way. The site is a great example of how standardised XHTML and CSS can be used to deliver content which is fast to download, browser-independent, and easy to update.

The layout follows a number of web conventions so that users can immediately identify how to use the site. Main navigation is kept simple: horizontal tabs, with the current page highlighted in a way that connects it to the content area. After leaving the homepage, a breadcrumb trail indicates the user’s current location in the site hierarchy.

The client had limited budget for this project and I wanted to give them the maximum return on their investment by ensuring the site can be easily updated and is future-proof. Most of the content including the navigation is editable text, styled using CSS, meaning that the client can expand the site and update the content easily without having to employ the skills of a dedicated designer.

As a charity that supports children with disabilities it was especially important for the site to be fully accessible. Semantic markup, well labelled images and unobtrusive JavaScript ensure that the site is accessible in screen readers, as well as being browser/device independent. Text can be resized using standard browser controls without breaking the design layout.

Role: interaction design; visual design; front-end development.

Tools: Adobe Photoshop, XHTML, CSS, JavaScript, Mootools JavaScript Library

Client feedback: “Absolutely brilliant. You have done the most amazing job and I cannot put into words how delighted and appreciative I am.”

Link: http://www.chancefornepal.org

Visual Design, Web & Mobile UX

Summary: These mockups were created for a friend to help him with a sponsorship pitch for his media kiosk. The idea was to place the kiosks in skate parks with cameras installed with motion detection functionality that my friend had developed. Skaters could then use the trackball interface to browse through recordings of their tricks and send them to a phone via MMS or upload them to a webpage, blog or email.

Role: GUI design; concept development; logo design.

Flash & ActionScript, Visual Design, Web & Mobile UX

Summary: This experimental site was developed as part of an investigation into user interface techniques. It uses DHTML, VRML, Flash and Agent technology to deliver a rich user experience.

As an educational aid it enables students to learn about the history of an area of particular geological interest. The interface features a draggable timeline, customisable land map, and 3D interactive rock samples.

Role: Concept; GUI design; 3D modelling, front-end development.

Tools: Adobe Photoshop, Flash, Autodesk 3D Studio Max, Bryce 3D, DHTML, JavaScript, Microsoft Agent

Flash & ActionScript, Visual Design, Web & Mobile UX