iPigeon.institute blog: shading

Translate iPigeon.institute in to your native language 💱

Showing posts with label shading. Show all posts
Showing posts with label shading. Show all posts

Monday, November 30

How to: hand-crafting a Material Design icon.

Google's Material Design website is a rich resource, dedicated to functional and compelling web | app design. On the website, there is a tutorial detailing the construction of a hand-crafted paper-based Material Design icon; done so (with paper), for the purpose of creating true-to-life shading. 

The tutorial inspired me to create my own Material Design icon, based from my "pigeons and friends" repertoire of square-shaped iconic pigeons [and friends]. Here are the source images:


According to the material.io guidelines, the icon's design ought be uniform in stroke thickness, somewhat bold and simplistic.




I've got a challenge, at hand, therefore, n rendering and shaping the image that I end up choosing, for the icon, in that my illustrations are more gesturally-based and freehand, rather than designed and pixelated. I'm somewhat hoping to design with a future-forward eye to the project (if that makes any sense), in perhaps trying to keep detail that I might, for the sake of higher-resolution Dot Per Millimeter (DPM) schemes on devices that are newer and allow for on-screen zoom, for further clarity. Otherwise, I stand to compromise the decipherability of the icon for the end-user's sake of identifying and connecting to the icon. My goal, other than the material.io website's 24 x 24 pixel design basis (for system icon's), is a larger visual scope final purpose, such as placement and viewership established on mediums such as the Google Play Store and Apple's App Store.  

Here are the tools and materials that I purchsed for developing the card paper "shaded" model of the finalized icon, which I purchased from Blick Art Materials store in Pasadena.





Updating...



Latest post.

Pigeon chat, with ChatGPT (12/22/2024)

  note: originally published with a typographical error in the title and web address; the title has been corrected, whereas the web address ...

iPigeon.institute’s most popular recent blog articles and posts