Website, logo and infographic design for Shark Free Chips, a new conservation initiative designed to promote sustainable alternatives to flake and chips.
- Client: Shark Free Chips (South Africa)
- Responsibilities: Illustration, Creative direction, Website design, Website development, Wordpress development, HTML5, CSS3, LESS, logo design
If there's one thing I like, it's sharks. If there's another, it's chips.
But that doesn’t mean these two things should be combined and the minds behind ‘Shark Free Chips’ clearly agreed.
It is designed to raise awareness of how the South African government is breaking its own laws and ignoring scientific evidence, to supply Australia’s demand for fish and chips.
In doing so, it is decimating the country’s own marine ecosystem, potentially beyond repair if this continues.
A different tone
As the fishery responsible for this illegal, destructive activity was up for review in June 2020, the Shark Free Chips team were keen to make a push for its closure.
Public action would be key to this and so, an engaging online presence was targeted as a priority.
I joined the team to oversee the development of the website and broadley speaking, establish the creative direction. Because I like sharks, drawing and anything which takes aim at corrupt governmental departments.
Now, I don’t know how many years I’ve been involved with marine research and conservation. What I’ve long argued though, is that misery is a competitive field with diminishing returns. Sure, many environmental issues are serious and if not addressed, could have catastrophic economic, social and environmental consqeuences.
But cultivating support means engaging the public.
Telling people the world will end if they don’t follow your lead, isn’t especially inspiring, nor do I believe it sustainable.
So my suggestion was we adopted a colourful, child-friendly aesthetic that would juxtapose the reality it was depicting.
I didn’t want to dilute or undermine the truth. Rather, I felt it would be more effective if delivered in a visual style that you wouldn’t normally associate with it.
This began with the logo. Rather than go for something minimal, vague or abstract, I advised we be bold and direct. I purposefully wanted to depict both the animal and a young child.
This was to emphasise that this is about the relationship between two species, but also a generation’s future.
Initial sketches were very rough, just to establish composition and scaling. I also experimented with various expressions and styles for the character
Stylisation and finalising the composition
Once feedback was received from the team, I began refining the components and incorporating a clear sense of style. Initially, I cited the likes of Disney, The Simpsons and kids toys as being references in terms of colour and tone. I didn’t want to mimic any one of these too closely, but they represented the values I felt we needed to embody.
The first step was to confirm exactly what the logo would comprise. We felt a mixture of the best three previous drafts would be the most appropriate. Namely:
- A realistically sized and propotioned shark.
- Clear but restrained facial expression on the character.
- Angled to equally balance all the various components.
Initial colour samples
It was important to consider how colour would effect the visual language of the logo, before going too far with the lineart. I wanted each component to be distinguishable by colour as much as shape. They also needed to be realistic. We couldn’t go ultra cartoony as it would contradict both the message and effort invested into the composition of the lineart.
Some of these colour combinations are frankly awful, but they were nevertheless important in determining what did and did not work.
Progressing with iteration
Each of these baby steps nudged the logo toward its goal. They also facilitated improvements at a more granular level. While completing the lineart, we were able to then invest more time into the small details.
Getting the size of the character’s eyes just right. Balancing the eyebrows and mouth in such a way that a real sense of sadness and shock are emoted, without being overly dramatic or repulsive.
Likewise, ensuring that the type would integrate without detracting.
I forget whether I coined Shark Free Chips. I do remember suggesting Fin Free Chips and Sharkless chips which didn’t read particularly well, or were too close to existing entities.
In the end, Shark Free Chips worked perfectly.
At this point we had achieved clarity over the general palette we wanted to use and finalised the line art. Therefore, the last stage was colour.
I was conscious that I could end up overcooking this. I have a tendency to get lost when colouring and just sink loads of time into micro details that end up being inconsistent with the rest of the piece.
So I gave myself some limits.
Specifically, each surface or collection of objects would have only three colours: base, highlight and shadow.
This would give me enough colour to achieve a real sense of depth, while maintaining the desired sense of simplicity and clarity.
Once it was completed, I did sort of break my rule by painting a final reflection pass. You’ll see hints of yellow where the chips are reflected on the shark’s skin, the orange of the loog in the dorsal fin and suchlike.
Again, they’re kept relatively subtle but just did enough to give the logo a final coat of polish.
Consistency is key
We all agreed that the identity and values we had established with the logo, needed to continue into the website itself. You might think that an obvious point, but I’ve worked on countless projects where at this very point, jumping to the finish line becomes the priority. In these situations, chucking a logo onto a free website template can become the preferred option.
The team liked the idea of making the site feel like a restaurant menu. This worked with the goals of the campaign and flexibility of the artistic style alike.
My approach was to keep the central areas very minimal and make effective use of white space, so that we could be more illustrative with the outer areas.
This gave the website the overall feel we wanted, while ensuring that the content remained clear and accessible:
Live demonstrations of the Shark Free Chips website across the core devices.
Incorporating the visual style into the content
As the design of the site progressed, so too did the accumulation of content. As this is a serious issue, we wanted to make the information factual, comprehensive and well sourced.
Conversely, we didn’t want to ram so much down the user’s throat that they become lost or disenged with the campaign’s goals.
I suggested that we base content around two core pages – Facts and Take Action.
By organising it as such, we could incorporate as much supporting information as we needed, safe in the knowledge that the main actions were always clear and only ever a click away.
Incorporating Call to actions into the design further built on this principle.
As each fact was written, I created further illustrations to accompany them. Colour was removed in the interests of simplicity and in some cases, dramatic effect.
As was the case with the logo, I felt it important that these illustrations be as true to reality as they were creative in execution.
Refining the interface
A third-party got involved during the latter stages of the project, to assist with social media and campaign management. They had a tremendous impact on refining the content and ensuring the actions we were encouraging were clear to the audience.
The site itself was developed using WordPress and a series of plugins I often employ on projects such as this.