đź’» Portfolio of Dean Clatworthy

I have been developing websites now for over twenty years and had the pleasure of working with some wonderful people over the course of my career so far. I have worked with small businesses & large corporations on their online presence and helped them become more successful as an online entity.

I have won numerous awards for my work and will try to highlight them below.

Below are some of my most recent clients & projects.

AdCouncil: BecauseOfYou

[Agency: hasan & partners / TBD] In collaboration with TBD agency in San Fransisco, I developed the website for this anti-bullying campaign.

Technologies used: HTML5 PHP MySQL JS CSS Wordpress

Plan Finland: Sheboard

[Agency: hasan & partners] Have you ever wondered about the difference in language you use to talk to boys and girls? We created a predictive keyboard app which adjusts the language you use to talk about girls. For this project I developed the website for the campaign (not the app).

Technologies used: HTML5 PHP MySQL JS CSS Wordpress

KONE: Machine Conversations (Part 2)

[Agency: hasan & partners] For the second part of Machine Conversations, we were tasked with promoting the launch of KONE’s 24/7 Escalator maintenance product. In order to do this we hooked an escalator into the same back-end system created for the original machine conversations in order to allow the escalator to tweet. We also filmed using 360 cameras an escalator ride, in order to embed a VR simulation of riding an escalator to the website.

Technologies used: VR AWS SQS IBM Bluemix Cloud NodeJS HTML5 JS CSS Wordpress

KONE: Machine Conversations (Part 1)

[Agency: hasan & partners]

Our pitch was to bring KONE’s 24/7 connected services offering to life in the form of converting the messages sent by their elevators into a live chat between the elevator and KONE’s Cloud maintenance. This was a huge undertaking involving close liason with KONE’s R&D team.

Messages are forwarded from IBM Bluemix to a listening service which stores all messages and adds them into an Amazon SQS queue. A series of worker processes then consume queue items and convert them into text conversations and their respective audio. The website then consumes these messages from an API and displays them.

An interesting part of this process is how to go from raw data into chat messages. Messages are represented as a JSON object featuring all kinds of sensor data including what is happening to the elevator (moving floors, doors opening/closing etc.) and then things such as the speed of the elevator and the vibration. This JSON is decoded and then fed into Symfony’s expression language. This allows content editors to generate chat messages based on what is actually happening in the message. For example an expression might look like so: elevator.stop_floor >= 0 and elevator.duration >= 5 and elevator.duration <= 35 and the corresponding chat message might be: Arrived on floor elevator.stop_floor. Travel took elevator.duration seconds. This allows us to generate an unlimited amount of variation of content for the chat.

Technologies used: PHP MySQL NodeJS HTML5 CSS JS AWS S3 AWS SQS IBM Bluemix Cloud

Valio: Suksi Ladulle

[Agency: hasan & partners] Similar to the Fazer Chocolate Hunt project, we utilised a database of outdoor shelter locations to create pins on a map that people and their families could visit during the winter months leading up to the world skiijumping championships - in order to claim the chance to win a range of prizes.

Technologies used: PHP MySQL HTML5 CSS Javascript

Fazer: Chocolate Hunt

[Agency: hasan & partners] For this project we placed virtual pins on a map throughout the course of a week, in a large number of locations allowing people to rush to the pins each day and claim a token to be redeemed for free chocolate in the Fazer cafe in central Helsinki.

Technologies used: PHP MySQL HTML5 CSS Javascript

Takeda: Panamol Pöpeli

[Agency: hasan & partners] A web-based version of the classic memory game. Built as a single-page ReactJS app.

Technologies used: HTML5 React CSS

TallinkSilja: Complaint Booth + Banner

[Agency: hasan & partners]

We retrofitted an old English phone box with a fake phone, powered by Skype, in order to allow visitors to a complaint booth to vent their general frustrations to a moderator on the other end of the phone. If the moderator determined the complaint was interesting, they were able to remotely print a free cruise voucher using an internet-connected receipt printer.

We also created a banner which was featured on the front-page of many of Finland’s most popular websites, allowing people to complaint about their day - and be emailed a free cruise by moderators if the complaint was interesting. The banner served millions of views over the course of 5 days.

Technologies used: PHP MySQL HTML5 CSS Javascript AWS

Awards won: Best Ads on TV

Metsä: Plan B

[Agency: hasan & partners] I created a static website, built using Jekyll, to showcase for potential Metsä customers how iconic structures might look and function if they were built out of wood.

Technologies used: Jekyll MySQL HTML5 CSS Javascript

hasan & partners: Eurobest booth

[Agency: hasan & partners]

For the Eurobest 2014 Festival of Creativity, I was tasked with helping with the development of the hasan & partners stand at the Eurobest conference. This featured two installations:

Plan: Sponsor of dreams installation

[Agency: hasan & partners] I created an integrated installation for Plan: Finland in Finland’s most busiest shopping mall which allows users to donate money into a box, and upon a successful donation it takes their photo. Photos are then displayed in a loop on the installation when a user is not activating it, and also on all other digiscreens around the shopping mall.

Technologies used: PHP MySQL HTML5 CSS Javascript Motion tracking

Metsä: Tree Online

[Agency: hasan & partners] Highly interactive and visual website for one of Finland’s biggest companies. Featuring an interactive video timeline and plenty of other visual eye candy. A community area was also created to allow Metsä employees to share their knowledge about the interesting thing the company does. Praise must also go to my brilliant former colleague Johannes Neumeier who I worked very closely with on this project.

Technologies used: PHP MySQL HTML5 CSS Javascript

Awards won: FWA Public Shortlist

Plan Finland: Girls Day Printer

[Agency: hasan & partners] We were asked to create a campaign where every time an SMS donation is receieved, or the website is shared using Facebook or tweeted, a tiny receipt printer in downtown Helsinki will print a few words of the 80,000 word report that is released every “Girls Day” by Plan Finland. This required integration from a website that I was responsible for constructing and a printer software created by Perfect Fools.

Technologies used: PHP MySQL HTML5 CSS Javascript

Angry Birds: Star Wars

[Agency: Luxus] I helped to concept and subsequently implement the official website for Rovio’s new title “Angry Birds: Star Wars”. Most of this work was HTML5/CSS3/JavaScript and using Twitter Bootstrap for a responsive framework.

Awards won: 2 webby awards

Iitala: Online web store

[Agency: Luxus] Front end implementation for the Iittala online webstore. This involved a lengthy process of converting wireframes to prototypes to a full front-end implementation into Iittala’s CMS. The project lasted almost six months and was a great success as one of the first responsive webstores for a leading Finnish brand.

Other projects

Unfortunately the internet moves quickly. A lot of projects have a lifetime and are no longer online. Here is a list of other clients and websites I have worked with that are no longer online and available to show anymore:

« Back to homepage