large_Crossover Series NFTs.png

medium_Crossover Series NFTs.png

small_Crossover Series NFTs.png

thumbnail_Crossover Series NFTs.png

From Photography to NFT Art: Twisted Digital Landscapes with Nate Hill

From Design System to ‘NFT Design System’: Creating TinyFaces

Neurodiversity and Inclusion: Choosing Kinder Design

medium_652ccf22c8853584bde5553986a4eed0.png

small_652ccf22c8853584bde5553986a4eed0.png

thumbnail_652ccf22c8853584bde5553986a4eed0.png

Web5 is here. Goodbye Web3? TBD.

<p>Published on <a href="http://ift.tt/2rn366G">| Prototyping: From UX to Front End &mdash; Medium</a> Eleken. <img alt="" src="http://ift.tt/2sljHot."></p>
<p>Metaphors are great tools to solve design problems. They translate an abstract idea into concrete one. Metaphors are understandable and enjoyable for users. They offer a diverse canvas for designers to explain unfamiliar content. UX design has always used metaphors to bring attention to new features.</p>
<p>You may intrigue and attract attention through metaphors. You can use them to influence user emotions as well. It makes your design more engaging and memorable. People love the playful design. So, leave a place for their imagination.</p>
<h3>Make the unknown familiar</h3>
<p>“For creating an illustration, designer must catch the main idea. Then, he searches the best way to introduce it by using understandable visual language for product audience. So, your product won’t be off the clients’ attention.</p>
<p>Also, using metaphors in illustrations allows us to play with content. It helps to emphasize the main features and shades the less meaningful things”, Olga Leskiv, UI/UX Designer at <a href="http://ift.tt/2qRVZlY">Eleken</a></p>
<p>Explain new product or feature through things clients already understand. Especially, when they look unfamiliar. For instance, <a href="https://trello.com/">Trello</a> helps to add tasks on the boards as in real life.</p>
<p><a href="https://flipboard.com/">Flipboard</a> allows you to turn pages as in the paper book. By using metaphors, you adapt users to your product’s interface. Referencing common stuff of the physical world allows them to understand the function.</p>
<p>The main thing here is to create a sense of familiarity. This allows the user to predict the results of his or her actions. In The Design of Everyday Things, <a href="http://www.jnd.org/">Donald Norman</a> writes that it helps the clients to overcome their own challenges. Consequently, they don’t need to blindly follow the rules. This authority improves the user’s interactions with devices.</p>
<h3>Trigger user emotions</h3>
<p><img alt="" src="http://ift.tt/2sl4bc8."></p>
<p>One of the most brilliant things about the metaphor that it helps to influence users’ feelings. For example, exaggeration brings increased attention to the illustrations. It helps to show mass phenomenon or a number of events. <a href="http://ift.tt/2rn9E5k">Natalie Ratkovski</a> in her book “Profession — illustrator. Creative thinking” describes how she created an illustration for one article. She drew huge bag that symbolizes brands. This bag was eating people. This colorful picture was able to describe the idea of snobbery. The metaphor was able to visualize the whole concept of the article.</p>
<p>Use the method of turning reality by 180 degrees. It helps to present “a parallel world”. This approach attracts the attention of the users.</p>
<p>Decrease some part of the body or architecture to trigger user emotions. It helps to evoke sarcasm as well. You need to find what you can change in the real object to gain new value.</p>
<p>You can also use understatement, provocation, and shock to engage users. They have gained popularity by helping to visualize specific product.</p>
<h3>Comfortable interface</h3>
<p>Metaphors need to be simple to become easy to understand. Users have to find out them intuitively. It gives you enough room to improve interaction with the product. Also, organize space to eliminate unneeded action. So, you will free up users to think less.</p>
<p>Make your interface comfortable as well. For instance, Twitter and Facebook have very simple navigation. The additional text helps to understand the icons.</p>
<p><img alt="" src="http://ift.tt/2sln8f7."></p>
<h3>Know your audience</h3>
<p>Adapt your product to your audience. Localize your service if your target audience is from one country. Make it fit for native traditions and values. For instance, in India, the standard ISO-type man was adapted to a traditional Indian equipment. For global service, use icons to handle language barriers.</p>
<h3>Real-life metaphors</h3>
<p>Create a good first impression in product illustration with appropriate metaphors. It is necessary for the visual metaphors to be anchored on reality. For example, a material metaphor is based on tactile actuality.</p>
<p>Relate illustrations to real-world objects. They are like a pair of jeans. They fit everything in product illustration. For example, people used to connect with three-dimensional objects.</p>
<p>Also, there is a principle “material is the metaphor” that has been around for a while. It includes ensuring visual hints that are anchored on reality. This may be motion and natural light.</p>
<p>Clients want to see products in action. They prefer to notice them in a natural light. You need to add many details as well. Let them imagine themselves using the products.</p>
<h3>Logotypes</h3>
<p>It’s not always entirely clear how to choose logotype. The goal is to pick one connected to your mission. Also, it needs to be relevant to your target audience. Wrong logo design will engage unwanted type of customers.</p>
<p>Avoid complicated metaphors. Test your ideas with users to bring understanding to your target audience. The best logotype is simple, fun and interesting. Companies want simplicity to affect the perception of the brand.</p>
<p>Experts advise not to focus on the number of ideas. Endless variants fail for client satisfaction. Choose the number of sketches according to the deadline, the size of the company and branding needs.</p>
<h3>Tips for metaphor creation</h3>
<ul>
<li>The illusory combination allows you to describe something. Translucency illustrates time flow.</li>
<li>Color, black and white drawings help to guide to a certain emotional state. You may use literal meaning of metaphors for good illustrations.</li>
<li>Metaphors can be designed to provide positive associations. For example, <a href="https://www.apple.com/">Apple</a> designed iMac with a sunflower in mind. Another example is a presentation of a cure for childhood diseases. Designers may draw stuffed toys instead of kids. It helps to mitigate perception of a problem. Also, this metaphor is easy to understand.</li>
</ul>
<p><strong>Conclusion</strong></p>
<p>Make it a point to explain unfamiliar things through basic stuff. Metaphors need to be simple and natural. For example, Trello allows adding tasks on the boards as in real life.</p>
<p>Flipboard helps you to turn pages as in the paper book. By using metaphors, you adapt clients to your product’s interface. Referencing common stuff of the physical world allows them to understand the features.</p>
<h4>Let’s make your product awesome together — work@eleken.co</h4>
<p><img src="http://ift.tt/2sl3mjM" width="1" height="1" alt="stat?event=post.clientViewed&amp;referrerSou"></p>
<hr>
<p><a href="http://ift.tt/2rn5vyf">Using Metaphor in Product Illustration</a> was originally published in <a href="http://ift.tt/2cAqCpx">Prototyping: From UX to Front End</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>


Using Metaphor in Product Illustration

Using Metaphor in Product Illustration

Top Stories