ILLUSTRATIONS
ILLUSTRATIONS
My vector artwork.
Embedded Files
ARTWORK
As a doodler and a sketcher I'm constantly inspired and motivated by everything around me and sketching out ideas for illustrations, logos and icons and bringing them to life in my favourite software tools to create crisp images and scaleable vector graphics (SVG's).
In this section I'm sharing a selection of my artwork and the workings and process behind them. I created all of these illustrations using Figma, my favourite vector tool.
LIPS
LIPS
PROJECT OVERVIEW
Following a long slow trip across London on the Underground I found myself casually sketching and came up with a self motivated illustration idea.
My concept was to re-imagine and create the London Underground symbol as lips holding the signage for a station.
My sketchbook showing initial ideas
As soon as I arrived back at the home studio I opened up Figma and set to work, referring to my sketches I worked on the shapes I wanted whilst trying not to be accurate at this point in order to get the ideas down.
Whilst Figma may not be the first choice for most designers for this type of illustration I love Illustrating in Figma and enjoy working with its limited tool set.
I setup the basic shapesthen added some shading using gradients to give form rather than a flat look, plus shadow for depth, and also an impression of shine as if the lips are reflecting a light source in the final version in the progression.
TYPOGRAPHY
TFL London Underground signage uses the Johnston typefaceand I picked out a similar font called "P22 Underground" which is based on Edward Johnstons Sans design of 1913.
FINESSING
Final touches were adding in the text signage and tweaked the shading, reflection and shadows to get the look I was going for in this self initiated piece.
I find it satisfying and therapeutic to work through a concept exploring ideas and directions, testing , prototyping and achieving the goal in mind.
ILLUSTRATIVE ICONS
ILLUSTRATIVE ICONS
I wanted to create some icons for my portfolio site with a very stylised illustrative look to add extra visual flair to not only visually represent the categories and diversity of creative work I create and produce but also as an opportunity to display more of my custom illustration work with my own icon designs.
All the icons and illustrations on this website I have custom designed and built, and below I am showing my process and journey behind one of them.
Example icons from Flaticon library
I had in mind large and illustrative icons rather than the simplified stroke interface type icon approaches as seen in icon libraries such as Flaticon. There is a trend and understandably a requirement due to scope, expectations, time and look and feel for designers to make use of existing icon libraries such as Flaticon and Font Awesome. For my own portfolio I wanted to create something beyond using my own artwork and style.
As this is my own project I was excited to develop my own style of icons which I have put together solely for my portfolio website. For this case study Im showing the original first icon of the 7 x illustrative designs I've created.
My sketchbook showing initial rough ideas
IT STARTS WITH A SKETCH
I had spent a little time in researching popular icons that are commonly used in webpage UI and had already decided on a different approach for my own needs.
Sometimes I do like to go straight into my design software and translate what is on my mind directly. However oftentimes I sketch things out first to explore shape, form and concepts, loosely and casually without restrain just getting ideas down on paper.
I try to avoid styling at this point but I am often drawn towards shading and shadow in my illustration work and that often shows up in my particular sketching style.
ICON CONCEPT
The first icon I wanted to tackle is for the concept of "Design" "Graphic Design" or "Visual Design" and I sketched around the idea of using a pencil as this is often where things start for me and is a good representation of creative work as a process and its an element I have used successfully in other projects.
Also although I rarely use a ruler in sketches, I thought it might help to instill and support the idea further in the viewers minds eye of the notion of creating, building, constructing designs. Following my initial sketches I knew I wanted to produce the icon in Figma.
Ive mentioned before that I am a big fan of Figma, at its core, Figma is a tool made for user interface design and prototyping. But I enjoy using it for illustration work, I like its mimimal tools and interface and reduced features compared to say Illustrator or Inkscape. I love working in Figma and challenging myself to take it beyond its original intentions.
PENCIL DESIGNS
Having established a pencil being part of the icon design, that was the first element I worked on and created a stylised silhouette that would be the basis of some iterations with variations of colour, shape as well as exploring gradients to give some depth versus solid colour shading.
SCRIBBLE LINES
I tried a few versions with the pencil angled to imply energy and add in scribble lines as if the pencil was drawing a line on the page to suggest animation or action in progress.
Trying out colours and introducing the ruler
Combining the pencil and ruler
Exploring pencil & protractor
FINAL DESIGN ICON
Working through multiple iterations whilst testing out ideas and alternative styles and layouts always helps me to focus in on what I am aiming for and exclude ideas that didnt make the grade but were essential in the exploration and finessing to satisfaction in the final design.
In my final design I designed and created 3 x elements, pencil, ruler and protractor, and put them together in a balanced layout with a feeling of energy and a semi realistic look and feel.
CHARACTER ILLUSTRATIONS
CHARACTER ILLUSTRATIONS
Sketching and doodling away from the computer allows me to explore ideas without restrictions or software boundaries and I let my mind wander as I enjoy getting my thoughts down on paper.
In this piece I had some ideas about a character design that would also provide the opportunity to try some looks and techniques using Figma. I'm showing my process and the workings behind the designs and illustrations for this character.
Sketching for a few minutes in my notebook helps me to shape some ideas and direction before launching into Figma. I then like to draw out some base shapes in Figma and think about form and quite quickly I get into colour and shading as I develop the illustration ideas and figure out some angles and direction.
I loosely follow some of my sketchbook work but easily branch out in other directions as I embellish and enhance what started as sketches and turn those ideas into solid designs.
Here I'm adding more colour, personality, and accessories as I explore and further develop the designs.
In addition to the character I like to create accessories to bring the sketches and character to life and by this point start to think about expressions with the eyes and lips.
Once I'm happy with the look of the character and establlished some personality, I develop some styles and outfits to enhance the range of looks.
Finally a full length version of the character with a pose and long black dress.
© john leigh illustrations
SOCIAL MEDIA POSTING
I post regularly on LinkedIn and a couple of online communities on a range of creative topics. I enjoy sharing my art and projects and recieving and responding to feedback and questions about techniques, approaches, process and software that may help and inspire other designers and non designers alike.
Page updated
Google Sites
Report abuse