This week, we looked further into illustrating and how to illustrate for UI.
For user interfaces, illustrations can provide a quick way to get a message across that doesn’t involve text. For example, a weather app may have an illustration of clouds and rain rather than plain text telling you what the weather is. Not only does this get information across quicker, it is also more engaging and visually appealing for the user.
“Sketching is not about being a good artist, but being a good thinker” – Jason Santa Maria
I like this quote because it shows me that I don’t need to make my sketches look perfect. Instead, it encourages me to be creative and get my ideas down on paper and then start developing them.
We were given some tips for sketching interfaces:
- Use a thicker pen: I had never thought of this before, but it makes sense. Using a thicker pen means you don’t get distracted by the unnecessary details.
- Draw straight lines
- Be thoughtful about colour: Colour can be used to highlight certain aspects of the sketches and make them stand out. This can make it easier for others to understand.
- Make your sketches comprehensible: Make the sketches clear so others know what you mean.
- Use the right equipment: Pens, sketchbooks etc.
- Time yourself: There are different sketching exercises you can do to get used to structuring an interface.
I found these very useful as there are some things I wouldn’t have considered doing before. I will be using these tips when sketching my wireframes for my app.
I thought it would be beneficial to do a quick exercise, taking these tips into consideration. I took the app Twitter and took just a few minutes to sketch out the layout of different screens on the app. These are the results:
Usually when sketching, I would use a pencil but this time I used a thicker pen. I found this beneficial as it meant I wasn’t caught up in drawing small details. I used basic shapes for different elements to show the layout and keep it simple. I added some colour to highlight some important aspects.
Illustrating in UI:
- Meaningful
- Recognisable
- Straightforward
- Clarifying
- Attractive
- Harmonic
- Improving user experience
- Not overloading the screen
I will refer to this list when illustrating for my app to ensure they are effective and well- thought out.
We were also told about the different types of illustrations. For example, hyper realistic or simple vectors. Both can be effective, but they give off a different tone. Another style is hand-drawn. These are often more unique and add a personal touch. I think the style of illustration all depends on your target audience and how you want to come across.
This week, I feel like I have learnt a lot and there is a lot I will take with me into my work and projects. I have really enjoyed learning more about illustration in UI and it inspires me to try out different styles and techniques.