Motion Graphics, Design & Illustration Showreel

Motion Graphics, Design & Illustration. I've connected with some amazing new clients this year and collaborated on some wonderful projects.

There have been a few long hours and late nights, but I can feel creative boundaries being pushed in the finished work going out the door (FYI, It makes an excited 'whooshing' sound).

Last 2 years I've been super focused. To step up, be seen, and keep it fresh. At the beginning of the year I rebranded, changing 'John Cooper Design' into Rocket Steps, Creative Studio ( reckon that's where the 'whooshing' sound came from).

It's helped me clarify my ethos. I don't outsource, I work directly with clients and the best ideas win.

I don't think I'd have had the confidence 10 years ago to be as bold with ideas as I am now. Also, I'm experienced enough to be humble when the client's idea is great, and I just need to execute it with style.

Start your new project

What Rocket Steps does;

  • Illustration
  • Motion graphics & animation
  • Website design
  • Branding
  • Explainer videos
  • Graphic design
  • Graphic recording
Illustration by John Cooper

Working directly with clients

I work directly with clients end-to-end. From ideas sessions to final delivery, to get the most from their budget and suggest ways to make the most of what they need.

Collaboration

I'm used by agencies and events companies for illustration and live art, when my style suits their needs. Being a solo studio means I can be super flexible on times, places and deadlines.

Looking to hire a motion graphics designer?

You can book me by the day or by the project. I can help you pin down a brief (a description of the work you need doing) and suggestions the best ways to tell your story and get your message across.

Need to hire an illustrator?

You can book me by the hour or the day. Never used an illustrator before, or have questions that's fine too. Whether you have a clear idea of what you want, or would you benefit from a handful of quick sketches to get the ball rolling.

Illustration by John Cooper

WordPress Tips to save you time.

Have I mentioned I'm a complete nerd for WordPress? I've been working with it for over 10 years now, building sites for businesses and keeping track of the cool things you can do to keep your website ahead of the curve.

Other builders have arrived like Webflow and Squarespace (which seems to sponsor every Youtube video I watch!) but WordPress still surprises me with its flexibility and adaptation.

At the moment I'm looking at the trend of storytelling or 'scrolly-telling' pages, that use video and animation to engage as the user scrolls down the page. No need to make a new website, as WordPress templates can handle this comfortably. Anyway, this blog isn't intended as a humblebrag, just an update and knowledge share.

Here are 4 ways to make the best use of WordPress on your website;

1. Check you're using Google Analytics 4.

Important if you're keeping track of visitors and traffic on your website.
At the end of July 2023 google stopped tracking traffic on websites that use early versions of Google Analytics. If you're tracking your stats, you should upgrade.

The good news is there's a plug-in called Site Kit which pulls Google stats directly into WordPress, making it easier to see traffic and visitor numbers.

2. Use patterns to make your page design more engaging.

WordPress 6 has a tool called Patterns. It's not that new, but it's now much easier to use. Selecting a pattern gives you a pre-made design block. Just change the text and images as you need to make your pages more visually interesting.

3. Manage social media posts from your website.

If you've used an app like Hootsuite you'll know it's a great time saver for posting to your social media channels with one click. You can also do this through your website with jetpack integrations. Connecting your social media accounts means that when you publish s new blog, it'll automatically share to your socials.

4. Save time and connect similar blogs with the query loop.

You may have a 'related news' feature on your website. A block at the bottom of the page that pulls in links to other blogs. Well, now you can add this feature anywhere on a page, automatically creating links to other blogs without having to search or create manual links.

The 'query loop' block uses categories and tags and is a great way to guide users to older blogs they might have missed. It's my favourite recent feature.

I try to keep my WordPress blogs as easy to digest as possible, avoiding as jargon and technical terms. After all, WordPress was designed to be used by non-technical users. If you're looking to upgrade your site, freshen it up with a new design, or get a new one from scratch, I can help. Your website should be easy and - dare I say it- fun to use, so you don't have to worry about technical issues, and can focus on creating good (human) content.

Start your new project
Winning WordPress Website designs

The art of scamps

Need scamps? You're in the right place.

Rough and ready quick drawings getting ideas down on paper. A lot of my output involves making scamp artwork. For my own projects and collaborations with other creative agencies who need to generate visuals quickly.
Scamps are very similar to storyboards or mock-ups. They help frame an idea, giving an art director or advertiser something to see that can help 'proof' a good idea, pushing it to the next stage, or decide if they aren't quite working, to help find the right direction.

They're an important early part of the creative process where speed and clarity are more important than the quality of the image.

scamp artwork
advertising scamp - John Cooper
scamp drawing
scamps from TV advert
storyboard artwork of Manchester train
storyboard art
mock up for advert John cooper
scamp artist John Cooper
scamp art by John Cooper
scamps

Scamp artwork examples

These examples are from various projects I've worked on (some unused, that I can show). From TV adverts to product design, it's often about facilitation, taking other people's ideas and converting them into images without being precious.

I've worked under NDA (non-disclosure agreements) with leading creative production houses around the UK. As you'll see in these examples, even at the early stage colour can be introduced a little, which often helps align with branding when presenting to clients.

Scamps happen at the very beginning of the process, and can on occasion stressful when they are created alongside conversations - that can go in different directions, but they don't have to be.

Good quality scamps help win pitches.

I have a background in comic art, and studied sequential art and communication design as a student. Learning the shorthand for storytelling and attention-grabbing that comics use so often really helps when it comes to composing images. Scamps can get messy quickly, and less is often more when it comes to choosing images for a presentation.

Get in touch for more info and rates.

Illustration of man on water jets looking very excited at having commissioned some illustration work

Links:

Book Cover Illustration - a not-so-tall tale.

Here's a recent book cover illustration for 'Football's Tallest Tales' by Bryan Gibson.

Getting the cover right is important, nailing the humour and tone the author is after. Illustration is problem solving too. You'll see in this artwork in the background, on one side is the crowd is cheering, while the other is fed up as the ball whistles past the distracted keeper.

We could have had the fans in colour but after discussion, it was decided to keep them in shades of grey. Why? Well, imagine if one side was red and the other blue. It's important to make the book appealing to everyone, so if one colour was the losing team, that could put off a potential reader who supports a team that wears that colour. Make sense? These are the things I consider when doing illustration work.

For this book, I created illustrations for the cover and inside panels - but to see those you'll need to get the book!

Book cover illustration

Available from Waterside press


Do you need illustration, or looking for new ideas? Get in touch for a chat;

Start your new project

What can an explainer video look like?

You've probably seen an explainer video. Traditionally it starts with someone talking, and then a hand appears and starts drawing what's being talked about, speedily making pictures to illustrate the subject. I've done a few of those, but they don't always need to look like that, do they?

I think it's just in the terminology, perhaps more folk have heard of the word 'explainer video' than say 'motion graphics' or 'storytelling video'. There are loads of ways of telling a story in a video, and explainer style is just one.

Where will it appear?

He's an example I did recently for NHS North West. You'll notice no sound or voiceover in this version. That's because in the initial meeting, we looked at what the team needed the video for, and where it would be seen. From there I could Then plan the best formats, so they got maximum value from the result.

Getting maximum value from the explainer video format

There were separate illustrations for print, a PowerPoint slideshow someone could talk over to an audience, and a version with text overlayered, to play out on a big screen in a conference room to engage an audience before an event began.

The end goal in mind

Having the end goal in mind helped the format. Identifying where and how the content would appear, meant I could lean into detail with the illustrations to engage the audience in my signature style. A great project to work on and cheers to the team for giving me creative freedom on it.

Start your new project
Illustration taken from an explainer video

Ask the robot dog assistant

Question: Come on then Turbine fella, how would you describe an explainer video?

Woof, an explainer video is a short and engaging video that explains a complex or tricky-to-understand subject in a simple and accessible way. It can be created using different styles such as hand-drawn animation or clean and technical data animation.

What could I use it for?

They can be used for a variety of purposes. They are great for simplifying complex ideas, introducing a new product or service, showcasing a brand or company, educating customers or employees, and promoting a cause or idea. 

How long should an explainer video be?

the ideal length of an explainer video depends on the complexity of the subject matter and the attention span of your target audience. Generally, most explainer videos range from 60 to 90 seconds. This is because attention spans are short, and you want to get your message across quickly and effectively. However, if the subject matter is more complex, the video can be longer, up to 2-3 minutes.

Start your new project

Useful links:

NHS GM integrated care

Can you draw sound?

Do you know what Phononics are? Can you draw sound?

Here's some new work I did for Professor Will J. Parnell for the International Phononics conference this year. As a creative, I love learning new things when I make animations and visuals - and this is a brilliant challenge.

"Phononic materials are engineered media that can manipulate waves propagating through them due to their synthetic and periodic architecture" Got that? My rough understanding is how soundwaves move through materials, and how soundproofing works.

Illustrating sound waves was pretty straightforward, with waveforms. Soundproofing materials was trickier. I looked at maths-based art (as that formed the exciting logo) with all its geometry, tesselation and symmetry, and the two parts came together nicely to carry the theme of the event. But where does the sound come from? These are the questions, and that's when the train the visual whoosh came in at the beginning.

Start your new project

Visual Minutes

Some great photos from an event at Z-arts & MADE in Old Trafford. 'Exploring The Creative Potential for Manchester to become a UNICEF Child-Friendly City'.

Graphic recording, artwork created by a live artist at an event
Graphic recording, artwork created by a live artist at an event
Graphic recording, artwork created by a live artist at an event
Start your new project

Photos by Lizzie Henshaw

Animating for #WorldAutismAwarenessWeek

Helping the NHS Cheshire tell positive stories of the experience of autistic people for their Autism Awareness Strategy.

The NHS Cheshire & Wirral are launching their new autism awareness strategy and were looking for someone to help promote it with some animation. Hello.
What was so cool about this project, is how open to ideas they were when I suggested using characters to tell a 'day in the life' story. We are all keen to get it right and make it really engaging. So less data and more story. It became a really positive collaborative process.

The Characters
Taking feedback from a group, the team tested a few types of characters, from basic shapes to talking animals and, settled on people with easy-to-read expressions.
Robbie, who brought me into the project had seen my pandemic comic strip, Distance, and was keen to use that style to render the characters, giving the animation (motion graphics to be fair) a comic strip feel to tell the story, some of which was taken from his own life experience.

The Script

The script was created collaboratively. I wrote up a first draft, a jumping-off point to work from. The team then added, edited and in our online meeting gave me plenty of notes to create a more well-rounded, story while keeping a light-hearted tone. If you want funny stories about real life - crikey, the folks in the NHS have loads of them!

The Recording

I did a first run, and then Robbie suggested recording people with lived experience. This made perfect sense, and as we weren't budgeting for full lip-synched animation and made the piece a lot more authentic.

Summary

In discussion with the NHS team, we looked at details like the use of colour, sound and clear facial expressions of the characters of Andy and his pal Seema. Big thanks to Maddy, Sharon, Lesley, Robbie and Mahesh for getting me in to be their art director, and creator of this video animation.

Start your new project

Do you have a story to tell? Not sure how to get started with it or just need some ideas?
Get in touch to see how I can help bring it to life.

Unearthodox ways to get a new website

A website can be many things. Unearthodox is an organisation dedicated to research, change and getting their word out. Their website is a marketing and information resource to share their pioneering work.

My role was taking the concept designs made by Radley Yelder and building the site in WordPress. There were plenty of moving parts in getting the 250+ page website up and running, and WP scaled brilliantly to the task.

What do you use your website for, and what do you need it to do?

Getting down to the nitty gritty, the Unearthodox website had great design, and engaging case studies. The team wanted to be able to add content easily, and categorise projects so they could keep track of the diversity of their output. I added interactivity and motion to create a really modern website.

In terms of getting the word out, the new Unearthodox website uses Google Analytics 4, and pulls the statistics directly into the site, so no need to go to the rather complex looking Google control panel to see what visitors are clicking on, it's all there to see in the website dashboard. This is really helpful see whats popular and help your content strategy.

The project 'slider'.
Start your new project

Is it worth having a website in 2023?

I'm biased as a website designer, but a website will give you a level of control that social media can't. With your website sitting on your own bit of internet 'land', you can do whatever you want with it and choose how you present yourself to audiences and search engines.

Why not just use social media?

Sure, social media is easy to use and services are often free, but you'll never own the content you post. Social media can change how they function too (I'm looking at you twitter) which can have a knock-on effect of how you're seen. The key difference is SEARCH. On social media, you're just one of the thousands of companies being catered for, so how you appear in searches can be limited.

Is WordPress any good?

In my opinion, it's the best tool out there. Certainly, this 250+ page website would be impractical with other off-the-shelf website builders. Of course, not every website starts at 250 pages, and WP's scalability is one of its great assets. Need a 10-page website? WordPress will do it, and will still be there in 5 years as you grow to 50 or 100 pages (the area where other builders become more cumbersome).

I still see WordPress websites that are mishandled, and I think that's just WP becoming a victim of it's own popularity. WordPress is open source. That's great for progression and innovation, but means it can fall prey to intrusive plugins and page builders. Getting a skilled WordPress developer is key to a good WordPress website.

Start your new project

Graphic Design for 2023

The lineup for and graphic design has just been revealed for Wentworth festival 2023. Every year I help the festival brand reinvent it's publicity to stay fresh and engaging, with great input from the folks that put it on. Looks like another banger of a year.

Posters by year:

Graphic Design by John Cooper. Wentworth festival
Graphic design for a family music festival
I need a poster designing
Branding and logo design - Wentworth Music Festival
Branding and logo design - Wentworth Music Festival

Website design (mobile version):

Website design on mobile phones
mobile website design
mobile optimised website
Start your new project

Wentworth Festival

Graphic recording for live events

It's been a busy year and a lovely way to round it out live drawing the national firefighters' conference, back again for the second year.

Graphic recording, capturing talks given by the guests there was a lot to digest. A lot of focus was on well-being and health, and I'm pretty sure the firefighting service isn't alone in having this as a priority to discuss. It was their 25th year and they had a lot to celebrate. My favourite talk was on sleep by Dr Sophie Bostock, as after 2 days of drawing solid I was quite ready for a power nap!

Graphic recording, live scribing, live art, whatever name it is given here are some more samples of artwork created at live events.

To find out more about getting live art an event please get in touch.

More Graphic Recording

Links

Big detailed Wall Illustration.

Here are a few excerpts from a large-scale wall art illustration I did recently. The final pieces are very big and I can't show you the whole thing, but this gives you a flavour of the final pieces.

These pieces are super detailed illustrations, not quite Where's Wally level wall artwork, but they did have to convey a lot of information and be engaging enough to stand the test of time if people were going to be seeing the work every day. It was a great project to work on and also time intensive!

Bespoke wall art by John Cooper
large scale illustration
Wall illustration
Wall artwork

Turning messages into illustration

The process of creating illustration work like this involved taking a lot of text content and then boiling it down. Turning those messages into visuals that were inspiring. Generating a lot of ideas and being imaginative with the messages was key to creating a good piece of wall art.

The whole project was done digitally, although it could have easily been done live on the wall. First off I created a series of sketches to cover each topic then needed depicting, and then these were arranged onto a larger canvas to find a good composition that would be narrative (tell a story), and not be confusing.

The sketches were drawn up in clip studio and converted into vector graphics from there. Vector conversion has come on a long way in recent years to convert pixel art into vectors, a format that can scale to any size. However, it's not perfect and still has a problem with very detailed artwork becoming muddy. Some of the original sketches had to be output at very high resolutions in order to convert without losing detail. The final pieces were tweaked by hand to smooth out any rough edges and then delivered to a very happy client.

    Get a quote



    , ,