Sherlock Holmes

Josh McCabe
5 min readSep 18, 2020

--

The Brief: Heroes and Villains

The Fame for this module is about Sherlock Holmes and are goal is to create and responsive website or ebook based on the fame.

— — — — — — — — — — — — — — — —

After being giving the brief for IXD304, I began doing some research on the fame which is Sherlock Holmes.

Who is Sherlock Holmes

Sherlock Holmes is a fictional detective of the late 19th and early 20th centuries. He was devised by British author and physician Sir Arthur Conan Doyle. A brilliant London-based detective, Holmes is famous for his prowess at using logic and astute observation to solve cases. He is perhaps the most famous fictional detective, and indeed one of the best known.

https://bakerstreet.fandom.com/wiki/Sherlock_Holmes

Sherlock Holmes quote:

“I had no idea that such individuals exist outside of stories.”―Dr Watson speaking about Holmes

Facts:

  • Sherlock Holmes is the most-filmed fictional human character but the must filmed fictional character is Dracula.
  • Holmes was inspired by a teacher
  • Sherlock’s IQ is 190
  • Their are at least 45

— — — — — — — — — — — — — — — —

So to get some inspiration for what typography I should use, I went to the library and found a book called:

A type primer

John Kane

Which is a book all about typeface from the beginning of the typeface to the modern day type face.

What I found interesting about the book, I give me an idea on what typeface was like in England in 1817 which was around the same time era the Sherlock Holmes books were created.

Which is when they started using big square-serif fonts in news paper, books, poster etc.

This book give me a better look on what typography I should use.

— — — — — — — — — — — — — — — —

Choosing a Typeface

After doing the research for what type of typeface I should use for the my Sherlock Holmes project, I went straight to adobe fonts, which is the platform where I’m familar with as I used it for finding typefaces for my other projects. So I know its reliable and a place to find the correct typeface I’m looking for.

After Looking around for a while I found a Font Pack called The Way Back Pack which was curated by Annie Atkins

Each Font is based around old films and advertising in the late 1800s and advertising.

Which I thought is a perfect time period on which Sherlock Holmes stories are set.

The font pack consists of :

  • Treeshirt (Regular)
  • Ratio Modern (Extrabold)
  • Trevor (Extrabold)
  • Cheap Pine (Regular)
  • Mrs Eaves (Bold Italic)
  • Gastromond (Regular)
  • Essonnes Text (Bold)
  • Essonnes Text (Bold Italic)
  • De Walpergen’s (Regular)

— — — — — — — — — — — — — — — —

Choosing a Colour Scheme

After finding the types of typography I should use for the Sherlock Holmes project, I began searching/ researching for a correct colour scheme for the project, which will be appropriate for the intendent audience (Sherlock Holmes Fans).

So straight away, I went to Adobe Colour which is a tool , I use often on helping me find colour schemes for my projects.

The first colour scheme I came across was:

UNITED KINGDOM — 1993

Which is a colour scheme I found quite interesting using dark green brown type colour, That could be used to demonstrate the colour of Sherlock Holmes green cap which I found out it’s called a deerstalker, mostly worn by hunters.

The second colour scheme I came across was:

Sherlock Holmes “A study in Scarlet”

The second colour scheme I found is based of a Sherlock Holmes called “A study in scarlet”, I found this colour scheme to be interesting because its based off a Sherlock Holmes book, also I the use of the dark wine colours demonstrates mystery.

The Third colour scheme I came across was:

Fashion

The Final colour scheme I liked called “fashion” is based on trending clothing colours at the moment, I Liked it because I found it to be a mix of the previous colour schemes I just looked at UNITED KINGDOM — 1993 and Sherlock Holmes “A study in Scarlet”.

In conclusion I will be using this colour scheme in the project.

— — — — — — — — — — — — — — — —

Sherlock Holmes Style tile

After finding out what colour scheme and typography that I would be using for my Sherlock Holmes website, I began putting together a style tile to help me, get an better idea of the overall look and feel of the website but also to help me communicate to my peers on what the ideas is about.

So first I began sketching ideas on what my style guide should look like:

Then after having a idea on what it should look like, I started bring it too life in Adobe illustrator, Here is the final result:

— — — — — — — — — — — — — — — —

Sherlock Holmes wireframes

After doing the style tile for the project, I began start doing some wireframes on my notebook just so I can get some inspirations after getting an Idea I started sketching more detailed wireframes.

Notebook sketching:

Detailed sketching:

— — — — — — — — — — — — — — — —

Sherlock Holmes prototype

https://youtu.be/vRrVXmHYe4w

--

--

Josh McCabe

UI/UX designer and student based in N.Ireland, I’m a visionary influenced by technology, design and business, always leaning towards improvement.