After two years, it’s time for a change. An evolution. The Work Of relaunches.
The site has been designed with the aim of less clutter and more work with all project images now larger than before. There’s also a more consistent branding over the range of all of The Work Of’s materials whether online or in print – as it should be.
Feedback on the new design is greatly appreciated. Drop me an email: neilATtheworkof.co.uk
In the previous Making Of entry, I wrote about how we had come to rest on our chosen Swine Flu campaign – Touching Man. You’ll notice that I keep calling the campaign “Touching Man” and not “Viral Man”. There’s a reason for this, which will be explained further on. In this entry, I’ll be writing about our efforts to come up with a unique look for the character and how he’d appear in videos.
Mini videos
Through our research in the first week of the project, we discovered that there were seven or eight main symptoms for Swine Flu and we wanted people to see Touching Man giving his victims these symptoms as separate videos. So, we wanted a video for sneezing, one for coughing, headaches, tiredness and others. However, because the campaign was about defeating Touching Man, these videos on their own wouldn’t work. It would look like he was winning. To counterbalance we decided that an identical set of videos would be filmed but with a twist – The ending would be different to each one. Essentially, video A would show Touching Man winning, while video B would show him losing.
My drawing skills aren’t the best, as you can see above, but Monday was spent developing a range of storyboards for all 12-14 videos that we wanted to produce. Because these would be in the style of adverts, we knew that they wouldn’t be more than 15 seconds long, which meant that we had to think of something suitable and funny that could be conveyed to the viewer in a small amount of time. Not only that, but we then had to think of an alternate ending for each one. Some of the videos proved difficult to think of endings for, while others seemed to make complete sense.
The frustrations of Flash
In addition to the videos, the committee had expressed their interest in developing a screensaver which could then be used on all University computers. We were really interested in doing this too but our downfall was that out of all four of us, none of us knew an extensive amount of ActionScript for Flash. Without this knowledge, the task of building a screensaver proved frustrating to say that least.
What we wanted was quite simple in theory. We wanted multiple spikey virus balls to continuously bounce off the edge of the screen and each other. We wanted to be able to set the speed, size and collision detection on each of the balls.
Because none of us knew much about ActionScript, we had to rely on finding and cannibalising various scripts found online, but none did quite as we wanted. Having no real experience with ActionScript, it proved to be a serious challenge. At times, we got close to a solution, but it just wasn’t quite polished enough to work. After two days of trying, I felt that it wasn’t worth carrying on and had to unfortunately scrap the idea.
The website
Part of the Touching Man campaign included a website to house all of the supporting elements such as a poster campaign and somewhere to house the short videos that we’d be filming. This would not only take up a lot of time on the project, but the responsibility of designing and coding it would have to fall to one person and one person only because it would be quite hard to work collaboratively on a site that was constantly being updated at two ends. I had already volunteered to take on the responsibility of designing the site and had also started a few sketches of what the site could look like.
My Flash skills aren’t fantastic, as already described, but I knew that in order to attract people to it and actually use it, the site must be built in Flash. It needed lots of transitions and animation to help immerse the user in Touching Man’s world. However, because we didn’t actually have any content for the site yet, it meant that we couldn’t even start work on it until the last few days.
On July 30th, we stopped work on the campaign to help out with welcoming the Archbishop of York, John Sentamu to the university to open a new building. I’ve already written about that particular day here so I won’t write about it again, only to say that it was a pleasure meeting him as he was a really nice man.
Turning the spikey balls into a reality
From the outset of the campaign, we were really keen to have something physical that we could give to new students that would remind them about the campaign. Because the Swine Flu virus is shaped like a sphere with spikes, we thought this would make a great toy or keychain. We began to research into companies who offered anything along the lines of what we wanted, going so far as to open up real time conversations with suppliers in China via Alibaba. There were one or two companies that said they had what we needed, but because of the language barrier, I didn’t feel confident enough to place an order with them.
Instead, earlier research had found an American company that stocked exactly what we needed. Rhode Island Novelty offered a set of eight different coloured spikey ball keychains and after a few emails back and forth, we managed to work out a great bulk price for 2,500 of them – the number of new students that would be joining the university. They proved to be really helpful in supplying us what we wanted. The order was placed and would arrive within a few days, all the way from America. I do wonder if they’d had such a large order for keychains before!
Touching Man’s costume
The last thing we sorted out for the week was what Touching Man would be wearing for his costume. We had decided that he would definitely need some sort of spikes and that he would definitely be green. I personally had envisaged him with some sort of shell on his back and was really curious to see if we could find something that would fit that vision. So, with that in mind, we took a trip to the local Homebase!
We visited a number of shops including a gardening store, pet store and a general convenience store to find anything we could use to make the costume. In particular, we were looking for things to attach spikes to and indeed things to make spikes from.
Above are just some of the things that we found. We had already set ourselves a budget of less than £100 to buy everything we needed for the costume (though we had a budget of three times that) and so using every day items and colourful toys like above proved to be a good cost-saving idea. Similarly, we also looked at these items too:
Although I was quite intent on buying some sort of shell for Touching Man, most of the stuff that we found was either too heavy or simply not usable. Additionally, both Will and Jerry said that they didn’t feel a shell was necessary. After a lot of persuasion, I sided with them and decided against the shell idea, but we picked up 12 of the long, green, neon sticks that you can see above. It was quite funny taking them to the counter. I don’t think people buy these things in bulk.
In addition to the above things, we also took a trip to Hobbycraft to buy some green facepaint, pegs, spraypaint (to paint the pegs), green felt and lots of other green things in general. In just a few days, Touching Man would be making his first appearance…
In the next entry: The birth of Touching Man and his first public appearances.
As mentioned in one of my Tweets, me and my University of Chester graphic design class had an exhibition on June 18th to show off our finest work to design agencies and the public. As part of the promotion of the exhibition, I was tasked to produce it. This included invitations, posters and a website. You can view the work here.
Producing an entire exhibition is certainly a different experience than simply creating a one-off piece of design. Producing an exhibition means taking everything into account and being responsible for it all fitting together and I have to admit that there were times when it didn’t seem like it was going to be done on time.
It all started at the beginning of March, when the class were told about the exhibition and the need to form a design committee to help organise and produce the show. A group of seven students originally volunteered to help steer the production in the right direction. Over the course of the next few months, we’d slowly begin to develop the show. To help with this, I set up a Facebook group and liaised with the tutors to send out an email to everyone asking everyone to join it so I could keep the class up to date with developments.
We invited the whole class to begin coming up with themes for the show. Something that the design committee could work with to develop invitations, posters and anything else that was needed. We gave people two weeks to develop their ideas into A3 boards and then discuss them with the rest of the class. This proved to be incredibly successful and from this, the idea of using exaggerated facts and figures was chosen.
The committee begin coming up with a range of facts that could relate to design students and their three years at University. This included ideas, hangovers, swearing, paper pads and computer crashes. These facts were then given large figures, based on one person’s experiences, multiplied by 60 (the number of people on the course). So where the average person may have 20 coffees a week, 60 people will have nearly 200,000 over the course of three years. What was clear after coming up with these facts and figures was that there was one fact that would always remain at 1 – the design show itself. This realisation helped to steer the project into the interesting direction of thinking about the exhibition as a culmination of three years. A filtering of ideas, good times, bad times and arriving at one design show, hence why the show was given the name “One Design Show”.
The idea of the past three years being filtered into one show made me think of how it had been tapered to a point – the point being the show – and this gave me the idea of making the invitation a triangle. Something that had a (literal) point to it. Using a triangle for an invitation would give added impact when sending out to design agencies and colleges because how often does someone recieve a triangle-shaped piece of mail?
One of my tutors had mentioned in passing that the previous year’s students had managed to make the invitation its own envelope and this was something that I also wanted to do to so I began to experiment with triangles and how they could fold up into an envelope to keep it secure.
The first idea consisted of a hexagon, with a cut from the centre to the edge. The invitation would then fold up into a concertina, leaving a triangle shape. The problem was that in order for this to work, there needed to be enough copy/image to fill 12 pages (six triangles on one side, six on the other) and this proved to be too much and not necessary. This design also meant that a separate envelope was needed. Additionally, because there was a lack of bleed area between the triangles, it meant that some of the artwork was bleeding into another triangle. In short, the idea failed, but the concept was there.
Sticking with the triangle idea but simplifying it, I decided to try it with three panels next to each other instead. This was much easier to handle and it meant that by adding a tab at the end of the triangles, I could fold the whole thing up and the tab would secure it in place, thereby forming its own envelope. I went with this shape and started on the design work.
The numbers for each of the facts were quite big. I wanted some way of trying to relate these big numbers back to a digital medium and the obvious choice was pixels because that’s what any piece of artwork is made up from at some point or another before being printed. I have always enjoyed the work of people like eBoy and their method of using pixelation as an art form. I wanted to take this and try and make it work on a larger, invitation and poster-sized scale. For this reason, I decided that iconography would be great to use.
I love working with iconography. It forces you to be economical with your design because you only have a 16x16px area to work with. Communicating a computer crash or a hangover in such a small space is quite an interesting project on its own but I had to make the icons work at print resolution. When a 16x16px image is printed at 300dpi, it is less than 3mm in width. This meant that the icon would need to be blown up if it was to be seen. However, by blowing something up so small to such big sizes, it was inevitable that they would look blurry and messy. Photoshop’s default method of resizing images is “Bicubic”, which is useful for things like photos. However, Photoshop also has another resize method called “Nearest Neighbour”, which allows pixels to stay sharp at larger sizes even when resized to ten times its original size.
The icons that I designed, although nice lacked colour and so a few of them were eventually redesigned including a red coffee mug instead of a white coffee cup and a few of these icons were using on the invitation that can you see on the project page.
Once the invitations were designed, it was then a case of finding a quote from the printers. The design department didn’t have a large budget to spend on promoting the show and tasked me with finding a suitable printers to print 400 copies of the invitation. Luckily, the invitation was small enough that two would fit on one A3 page, which meant that it immediately cut the costs in half. Unfortunately, due to the unusual shape of the invitation, they could not offer diecutting for price inside the department’s budget and this meant that I, along with a few other people were tasked with cutting them manually.
After the invitations were taken care of, the next thing was Moo Minicards. At an early stage of producing the show, I had remembered a great website called Moo. They offer business card-like cards, slightly smaller called Moo MiniCards. I thought these would be a great addition to the show, allowing someone to take something away from it and keep a piece of student’s work with them. My idea was to put a piece of student’s artwork on a total of 100 cards and order 5 packs of them. Each pack costs just £10 so it was well worth it. I requested that all students send me three pieces of their work with their full name and website address. These cards were then scattered all over the tables between each student’s portfolio, making the tables come alive with colour and inviting people to pick them up and look more closely at the work.
The next thing to design were the posters which would help direct people to place in which the exhibition was being held. Originally, the idea was to produce 5 x A1 posters that would be easily visible around the campus. However, after walking around the campus and figuring out where the posters would go, it was clear that more than 5 would be needed. The budget didn’t allow for this. Instead, the posters were designed at A3, which meant that more could be produced and a fraction of the cost of 5 x A1 poster. A series of 8 posters were designed and printed twice, giving me 16 posters to place around the campus in preparation for the opening night.
So as to identify each piece of work on display, nametags for each exhibition stand were designed in the same style as the invitation and placed above each stand. Although a very simple part of the whole production process, these triangles, like the invitations had to be manually cut out of card.
Finally, a simple website was designed by myself and built by Liam Gallagher, another student on the course, that housed a few student’s work, descriptions of it and information on the show itself including when it was open and how to get there.
Overall, producing the University of Chester’s graphic design show was a really good experience. Liaising with so many people about so many different aspects of the show proved to be very difficult at times due to other coursework-related committments, but I believe that the end result was executed well. In particular, I was really happy with the quality and popularity of the Moo MiniCards that I had designed. As mentioned, I had a total of 500 cards printed and by the end of the seven day opening period of the exhibition, there were less than 100 left. Also, I was pleased to overhear some of the public who attended the opening night of the exhibition express their approval of the posters I had designed. It’s always nice to hear that something you’ve designed has been met with praise.
I’ve really enjoyed working on such a large scale project and I hope that I can do so again in the future.
Let there be light.
The Work Of has finally launched and this version is here to stay. Completely redesigned and now fully automatic, my site is going to see a lot more attention over the coming months. This version has been in the works for over two years on and off now and it’s fantastic to finally be able to launch it and begin regularly updating my portfolio with the many clients I’ve been working with over the past few months and indeed years.
As I said, everything is now automatic, which means adding stuff to the website is now so fast and easy. This includes everything in my portfolio, this blog and, if you’d like to scroll down the page, you’ll see a nice list of interesting links, which will also be updated regularly. As you can probably tell, I’m like a kid with a new toy. This is my favourite toy. My thanks goes to Colin from XAdvance for developing it with me. I’m no coding expert but he is.
You might find a few errors here and there but don’t worry, I’ve already spotted them and they’ll be taken care of ASAP. It’ll take some time to get things back up and running so you may find that my portfolio is looking a bit empty as you read this, but give me a few days and everything will be back up there along with some fantastic new projects that I’ve been working on. I’m really looking forward to using this site more often and your feedback is as always very much appreciated.
Let me know what you think of the new site and thanks for stopping by!
As said in a previous post, I didn’t think my redesign of my website was good enough to display my work. With that in mind, I decided to redesign again and I’ve just completed and uploaded it. You can see it at www.theworkof.co.uk.
Although it’s not perfect, I do believe it satisfies my needs a little better and I’m much more comfortable with it than the previous design. There are a few key reasons why I’m happier with this design. You might want to consider these reasons if you’re designing your own site, too.
Firstly, it catches your attention better. This is because the logo is now at the top of the page, with a bright header image that directly relates to the logo and indeed why the logo looks like it does. Also, this design looks much more like it relates to my business cards.
The header image is linked to my biography, which I believe to be an important part of why a potential client should choose me over someone else. It’s not an extensive biography and it’s subject to change, but I do believe that this works better than what I had before, which was far too long. One thing that is currently missing from my bio page is my CV, which I intend to add shortly.
It’s now easy to see when I’ve updated the site with new work, as new work will appear on the main page of the site. While I will of course be producing work all of the time, it will be at a slow and steady rate, rather than churning out something new every day, which is why there is only need for one new artwork space on the front page. It allows me to rotate new artwork when I want.
My blog is now directly accessible from the front page and much more visible. I want this blog to be quite an important part of my site as this is where you can find all of my behind the scenes writing and images, such as developmental work.
I think it’s important to show potential clients what I’m looking at to get my inspiration so I’ve added a third section called “Elsewhere”, which gives a short list of links to articles which I’ve been reading recently around the web.
The way in which I’ve designed this site allows me to use the full width and height of the layout so that any work can fill it. I think this makes the work look larger and allows the viewer to be enveloped in it. I’ve also spread the work out onto multiple pages, rather than making the user scroll down the page. Again, this is so that the user can be fully enveloped in one piece of work or a part of it.
As I said to begin with, I’m much happier with this design although of course as a designer, I’ll never be 100% happy with it and it will most likely evolve over time to further suit my needs but for now, it’s something that I’m happy showing potential clients.
I’d really love your thoughts on it so please feel free to either email me at neil @ theworkof.co.uk or comment on this post. Thank you.