The task
The task I set myself was:

"To evolve and expand the current brand design produced by Darren Curtis, to have a flexible identity that can efficiently and quickly be applied to any asset, no matter the size, across the Gordon Murray Group and its subsidiaries."

Constraints
To ensure the case study remained within the realms of reality and it was not a “free reign” design, or "ego massaging" project, some ground rules and constraints were produced:

• There would be no “from scratch” new logo, only the current design being tweaked
• To reduce implementation cost, the design cannot have one-off type purchases, and instead they were to be free or part of a subscription-based design suite (e.g Google Fonts, Adobe Fonts, etc)
• The letterhead design should allow usage in Microsoft Word, by any employee, and be printable with a standard office printer
• For some of the assets, I was limited to photography that Gordon Murray Group had provided, or external photographers shared under a Creative Commons license

I wanted this case study to showcase print and digital applications. Thinking about the needs of a boutique automobile company and the sort of work I have done at my current employer, I shortlisted the items to:

• Evolved branding that considers design system/structure, type, colours
• Evolved branding assets to include:
• • Letterhead
  • Business card
  • Press release
  • Vehicle livery
  • Signage
  • Banners
  • Employee ID card
  • Apparel
  • Phone case
  • Keyring
  • Umbrella
• Evolved, flexible logo that is scale-responsive
• Animation of evolved logo to allow intro/outro for video assets
• Owners magazine
• Bookmark
• Owners manual
• Trade show stand at events (e.g. Goodwood)
• Email
• Interactive, mobile, car configurator

Beginning the case study, I undertook a weeks-worth of research to increase my understanding of Gordon Murray Group and its philosophy.

This was done by reading articles or magazine pieces, reading the press packs of T.33, T.50 and T.50s, watching YouTube videos such as where Mr Murray reveals his garage to Johnny Smith, or talks to Harry Metcalfe, and refamiliarizing myself with earlier cars such as the F1.

What I learnt was:

• The mermaid in the logo has been Mr Murray’s family crest since the 12th century
• Certain branding elements recognise Mr Murray’s Scottish heritage
• There are seven core principles that guide the company
• Mr Murray’s key vision (that can be traced from the IGM Ford to the T.33) is ‘lightness’ and ‘purity of engineering’. For example, in a YouTube video Mr Murray says “the taillights are circular as the circle is the purest shape”
• The new campus designed by Design Engine Architects showcases natural materials such as wood and airiness/openness

After the wider company research, a more focused design research phase was undertaken to understand, from an outsider point of view, what worked and didn’t work for the brand and potential customers.

---

Please note:
As an outsider, and without access to brand philosophy or assets, this process is always compromised as I will not fully understand the company goals, what the design team envisioned, or how it comes together. Further this phase normally tends to include personal bias on what the person generally likes and dislikes. Please do not be offended by the below.

---

My conclusions were:

• The logo does not scale with size, and remains in one variant when reduced, and this hampers legibility at smaller sizes
• At 11, there are too many colours to represent Gordon Murray Group and it’s subsidiaries
• In digital assets, there have been too many colour variants of the logo (e.g. red, yellow, cyan, orange, black, silver, etc)
• The fade-in/fade-out animation of the complete logo, rather than a slow reveal, is slightly dated
• Unsure of the main colour that represents Gordon Murray Automotive. Throughout this project on the website I think the accent colour has related to the vehicle model revealed.

I wanted the proposed design system to reflect the company ethos and Mr Murray’s love of lightness and purity of engineering.

My proposal would achieve this by being as simple as possible – achieved by using thin sans-serif headline typefaces, thin hairlines, and precise tonal colour blocking for sections.

The benefit of a simple system is that it’s easy to understand, efficient to produce, can be replicated by staff of all expertise and technical proficiency, and digitally allows for increased flexibility in animation (for instance sections can ‘rubber band into view’, ‘slide in’ or ‘fade in’).

The modular and cohesive system provides the ability to incorporate colour and photography with great flexibility, and allows a strong level of individuality to each asset, while remaining part of a clear master brand.

The sections are broken down into a maximum of five components that can be rearranged as wanted in the composition/asset:

• An optional descriptor section
• A heading section
• Secondary info section
• Imagery section
• An optional logo section (logo can alternatively be incorporated into other sections)

For items produced using publishing software the A4 page layout is a simple five column grid, with 5mm gutter and 10mm margins all round. Horizontally the page layout is broken down into 12 sections between the top and bottom margin.

This provides a style that allows flexibility for layout and still manages to save overall pages used. (For example, using this design structure for the T.33 Spider press pack allowed imagery to be included and still save pages over the Word Document.)

For the colour scheme the main goal was to reduce the main palette from 11 to 3, one each for the Gordon Murray Group, Gordon Murray Automotive, and Gordon Murray Design. The benefit of this reduction would be greater familiarity for the public between the colours and the companies.

From my research I found that the colours yellow, orange, red, blue and black are widely used by the company at present and in the past.

From these I selected black for Gordon Murray Group, with my rationale being it is a base colour that pairs well with all other colours. I also liked the colour theory of how when colours are mixed together they form black, which can reflect the subsidiaries coming together to form the group. Purely due to personal preference I selected the slightly warmer PANTONE BLACK 6C, rather than the existing CMYK 0/0/0/0 value.

For Gordon Murray Automotive I selected yellow as the identity colour, in the warm and inviting PANTONE 113C hue. I chose yellow for three reasons:

• It’s historically linked to the Murray clan, being used in early crests and ancient arms
• It’s currently being used by the company in various settings, for example as the website accent colour
• it seems to be a prominent colour for future use, for example featuring greatly in architectural renders of the new company headquarters

For Gordon Murray Design, I again wanted to draw from the Murray clan heritage, as well as use a primary colour to help complement with the yellow. My options were blue or red, and I selected red in the commanding PANTONE 185C hue, which has been used in the clan’s tartan pattern, and was already being used by the company to represent a subsidiary.

The various combinations of the colours pass the accessibility colour contrast check.

For the type I wanted to have the classical combination of sans serif headings with serif body text, rather than just sans serif (or two different sans serif) as in smaller settings they become harder to differentiate.

The current type used by Gordon Murray Group was Soin Sans Neue. This type has great variability in the number of weights available, shows humanist characteristics, and is very good for large lettering.

Unfortunately it was only available to purchase through a type foundry/store, and I wanted to stick to my constraint of only getting type through free or subscription-based design suites.

I started looking for a substitute and chose Apparat, available on Adobe Fonts, as part of an Adobe Creative Cloud subscription. This type also has humanist characteristics and is available in a variety of weights. What especially drew me to the type was its simple, shape-driven construction, that to my mind recalls engineering and is evident in the thinner weights.

To complement Apparat I needed a suitable serif font. Following research I found the type Miller Headline/Miller Text Roman, which offers great variability in its styles and number of ligatures. The shorter and wider construction contrasts Apparat very well, and so proves a good pairing. Importantly it is a typeface that is of Scottish origin, modelled on work by the Edinburgh based William Miller and his work in the 19th century.

These then came together in various sizes, weights and styles to give the design system a type style:

The mermaid crest has been used by Mr Murray’s family since the 12th century, and this heritage was a major factor in adding the constraint of not changing the logo. Instead, by careful evolution I wanted to make it a touch more abstract, to help it resolve better at smaller scales.

Reasons why I believe the logo has issues at a smaller scale are:

• The tight gap between the hair and comb-holding arm
• The scales that have non-uniform spacing
• How the edges of the scales and fin lines do not follow the curves
• Logo is drawn ‘as-is’ at smaller scale, with no adaption to account decreased space

The first step was to redraw the logo, incorporating subtle tweaks, while maintaining the overall look. My changes were:

• Reducing the size of the hair, and having the tips follow a concentric path while having different radii – increasing gap to arm
• Bringing in the rear of the head so overall it is circular
• Slightly bringing up the thumb on the comb arm so it is level with the mirror arm thumb
• Redrawing the lips so they and the nose paths are perpendicular
• Redrawing the fin so the top half is less “heavy” in appearance
• Changing the scales direction so they follow the tail (as it has appeared in historical depictions)
• Having consistent spacing between the three scale paths and having each level undulate within themselves to feel more natural
• Having the edges of the fin lines and the scales follow the curves of their respective bodies

For the wordmark I wanted the type to be as close to the current type as possible. Despite researching this I was unable to work out what type was used, and therefore settled on setting it in Red Hat Text.

For the colour variants the logo was produced for the three main subsidiaries in regular colour, inversed-out colour, and darkened colour.

To provide crucial size scaling the logo was redrawn at four levels, which were:

• Original
• Reduced
• Small
• Monogram

At each decreasing level the amount of detail is removed to aid legibility. This is usually through the amount of tail scales and fin lines used.

The monograph version only shows the head against a partial sun backdrop, with the shoulder being slightly redrawn to give a more natural flow to the drawing.

I envisage the ‘reduced version’ to be used on small screens or print mediums, such as Twitter posts, physical postcards, etc. The ‘small version’ can be used where print quality is difficult to achieve or where space is at a premium, such as stamping or lasering metal screwheads, cardboard boxes, etc. The ‘monogram’ can be used for profile pictures, newsletters, video idents, etc.

I felt it was necessary to have a fully animated logo that had a “slow procedural reveal” element to it, that allowed it to be used in intro and outro video segments. I believe this helps allude to the quality and craftsmanship of the company and the luxury it provides.

The logo reveals itself by drawing the body outline, then the fin, it adds the details, followed by the body colour, and finishes with the ‘mirror’ colour being filled. Optionally the text ‘Gordon Murray’ appears alongside.

The animation has been produced in a few options, ranging from ‘alpha channel only’ to a version with the blue and green tartan pattern behind it.

Alongside the main logo animation, one is also produced for the monogram. This is simpler with a ‘wipe up’ reveal which in sync has the sun change from a midnight blue to the brand red.

Various branding assets were mocked up to show how the design system would come to life, ranging from items as small as a keyring, all the way up to car liveries. All assets employ the ‘section’ componentry and have it arranged in various styles, to suit the medium as required.

The letterhead has been deliberately paired back so it can be efficiently used in Microsoft Word by any staff member, and printed on a regular office printer.

The press kit document has been inspired by the one provided in Microsoft Word format for the T.33 Spider launch. The new document manages to save three pages, from the Word version, despite having the exact same content and adding imagery – proving the efficiency of the system.

There are various other company stationary assets.

The design system can also be applied as various vehicle liveries. To be a little tongue-in-cheek the livery has been mocked up on a Piaggio rickshaw to show a lightweight parts delivery van.

I felt a magazine that would be made available to owners can help showcase the seventh Gordon Murray Automotive philosophy, of “The customer journey”.

The first step was to think of a publication name. I originally thought of phrases that contrasted with ‘lightness’ and highlighted authority to news reporting, such as ‘Heavy Media’ or ‘Heavy Industries’ or ‘Minima Opus’.

In the end, for two reasons, I chose the name “670 GSM”. Firstly I thought this could reflect the paper weight of the cover, and secondly it included the year Mr Murray competed in his IGM Ford car, 1967.

Then I decided on the paper stock and chose a size that is slightly narrower and shorter than A4, and almost a square. I felt this unusual media size would subliminally hint at ‘luxury’ and ‘craftsmanship’ as it is not a size that is available off the shelf.

The typefaces used were again variations of Apparat, Miller Headline and Miller Text. The colour of the pages however is dictated by the content of the pages. Throughout the magazine the images are from press photography, social media posts, or stock imagery.

For this mock-up I wanted to have a cover story on the T.55s. I very quickly decided to change the colour of the car from the orange in the press release to yellow, which I felt better complimented the dark blue. I then started making photo compositions using the press photography and stock imagery to make it seem the end result was a real in-place photo. My initial ideas were to have the car upside down (alluding to downforce) or in front of a wind tunnel or turbine (alluding to the fan system).

I decided to save the ‘upside down’ image for the inside pages and experimented until I was happy with the overall cover:

For the rest of the sections I came up with features that I think would suit a publication from Gordon Murray Group, or were connected to key individuals, or which I had imagery for. As an example, the ‘In development’ feature remixes the photography Gordon Murray Automotive were posting to Twitter.

The text content is a mixture of placeholder text, text I’ve made up, or articles from news stories available online.

To complement the magazine I produced a simple bookmark that is curved at one end to follow the monogram logo. The rest of the bookmark has an illustration of fauna, inspired by Mr Murrays love of tropical shirts. This pattern is also used for the mobile phone cover, which would prove popular with younger generation of fans.

To showcase some of my Photoshop and marketing understanding I wanted to produce a series of A4 magazine adverts that promoted the current products.

These would follow the new design system, and would be inspired by old-school print adverts, such as the Porsche ‘Nobody’s perfect’ or ‘In Germany there are no getaway cars’. This is done by having tongue-in-cheek copy, borders around the edge, and the typeface.

I had read that the McLaren F1 owner’s manual had illustrations rather than photography for when imagery was needed to support text. I think something similar would be a nice touch for owners.

Gordon Murray Automotive attends major car shows, festivals, and events, with a lot of these requiring an outside stand.

I think a unique stand would create positive news stories for the company and help it stand out against other manufacturers, increase footfall of future customers, and perhaps with positive new stories and ‘buzz’, increase chances of investment (or be associated with the brand).

My proposed exhibition stand design would be centred around the T.50 and its unique fan system.

To reiterate, as this is already sold out, the purpose of the stand is to create buzz, that would help drive investment into the company. This could happen by visitors taking pictures for their social media, publications posting stories, etc.

The design of the trade stand would be three concentric, circular, timber framed, walls nested within one another, that reveal a T.50 attached upside down to the roof of the inner space. This inner space is devoid of any other features (apart from lighting) to allow it to be a backdrop or focal point for people interacting with it.

The outer space would be of two halves, with the rear providing a closed-off area for private meetings, and the front providing a communal area for people to congregate.

I initially sketched out my design to figure out how it would work and the dimensions of the stand.

I then produced the stand in isometric, before progressing to an architectural sketch:

Lastly I used AI tools to try and render the stand to photorealistic standards:

I believe the mounting of a car upside down has not been done often, and if it normally is off the ground it is mounted vertically to a wall. I believe this arrangement will stand out against other exhibitors at events.

Having produced print assets with the proposed brand system I now moved to digital assets. I am confident it can be applied to a website, but for now I concentrated on producing an e-newsletter in MailChimp.

The design utilises the ‘thin line’ and ‘coloured sections’ of the brand system and employs the animated monogram as the primary logo. To aid legibility, where there is a white background, the red hue of Gordon Murray Design is used, rather than the yellow.

I have deliberately made the imagery black and white, and introduced rounded corners to them, as it helps mask low-res images and makes the email more ‘approachable’ respectively.

The stories are related to various aspects of Gordon Murray Automotive and were produced as they could become regular features.

To refresh my Figma knowledge and to highlight my product design skills I decided to make a mobile car configurator for Gordon Murray Automotive.

The configurator shows the T.33, T.50, and T.50s with the user being able to configure their T.33.

As with the exhibition stand, while all the cars are sold out, I feel creating an asset like this will be beneficial in the long-term. The goal of this asset is to create ‘buzz’ and inspire investment or future customers to come to Gordon Murray Automotive.

The first step was to understand and research what a user may be interested in configurating. Having spent a lot of hours throughout my life on configurators (such as the ones on Porsche, Aston Martin or Rolls Royce) I understood that it provides a chance to dream a little, feel connected to the company, and to think how if they had the money, what a user’s ideal spec would look like. This is backed up with people posting ‘build sheets’ on forums such as Pistonheads whenever a new car model is released.

From my research I found most configurators had:

• Model selection stage
• Exterior paint stage
• Wheel elements stage
• Interior colour stage
• Interior trim stage
• Option selection stage
• Accessories stage
• Summary and next steps stage

Some of the higher end configurators had 3D models, dynamic lighting, and video incorporated into them. A few were running on Unreal Engine technology and had very high fidelity graphics.

My prototype would incorporate most of these stages, with a few items scaled back:

• I would be using T.33 press photography so could not have an interactive 3D model
• I would be using T.33 press photography, and so only had one alloy wheel design
• Due to the number of possible permutations (calculated at 552,960), with each requiring setting up, the ‘summary stage’ would not be dynamic and show a users individual configuration, but rather a generic one

I also decided that rather than say a vehicle is being “configurated” it should say a vehicle is being “commissioned”, as this feels more bespoke and special. This is something that Rolls Royce and Bentley have on their configurators.

I hand sketched the user flow and produced low fidelity wireframes of the functionalities. In these sketches I had the various options in a ‘circular carousel’ but feedback from a few friends suggested it would be better if it was a simpler ‘tap to select’ option.

The UI of the prototype used elements from the earlier brand design, with Apparat and Miller being the typefaces, elements being ‘thin’ or ‘airy’ and a use of yellow and red. I wanted to avoid a stark white background or one with a pattern, as that is what most companies used. Instead I had a pale yellow background with a red gradient.

The UI elements all follow basic design principles, for example rollover states on buttons, consistent placement and recognition of items, clear signposting, etc. On the model selection page the gradient intensifies as the model ‘steps up’ to a racier model:

For the exterior I had six viewpoints, with the various exterior colours being produced by editing the T.33 press photography in Photoshop. For each colour the naming structure was ‘race track element + hue name’, with both being related to that colour.

For example ‘Druids Absinthe’ is named after Druids corner at Brands Hatch, and Absinthe for the yellowy-greenish hue of green. It is then applied to a green hue that is normally associated with British cars.

I produced 16 colours in total, segmented into three palette groups. Originally I wanted to segment them by the weight of each paint, but my research was inconclusive at finding how much paints weigh. I therefore segmented them into the visual impact of the paint (elegant, timeless, and bold).

For the wheel section I provided options for the brake calliper colour, alloy wheel colour, and a selection of tyres.

For the interior I provided three driving environments (contrasting seating or complimentary seating or complimentary seating with contrasting dash), and limited the material colour to six elegant dyes.

As I did not know what trim packages or options a real customer can purchase for the T.33, I had to make informed guesses using my research of other vehicles.

For the trim stage it gave the option of choosing wood as a material, increasing seat padding for comfort, or tinting the windows. For the options stage I provided generic up-sells that automobile companies provide.

The summary stage shows a generic commission.

To add some polish to the configurator I edited the T.33 reveal video on YouTube to provide a quick sizzle reel that appears when the T.33 is selected at the model selection stage.

The configurator has been prototyped to be fully interactive. It has a working menu, navigational buttons, return-to-home button, and has had logic and flow applied to it.

Some quirks of this prototype are:

• Due to the level of detail assets take a bit of time to load
• Image carousels do not ‘snap’ at the edges (as they would in real life) when scrolled but ‘rubber-band’ into position – this is incorrect but not solvable in current setup
• The ‘Trim’ and ‘Options’ stages require selecting of items, and then unselecting to move the page forward. This is due to them having a ‘workaround cheat’ employed where it shows a selected item by substituting in an off-screen element instantaneously. This was done as it helped reduce the number of permutations that needed prototyping