Tuesday, November 20, 2018

transparency - How can I make a shape look like it is made of glass?


What are the general principles I can apply to make a shape look like it is made of glass? More specifically I want to make some simple graphics that give the impression of looking at a lens side (see below). I was hoping to find a scheme that would work for a variety of different lens shapes (convex, concave etc.).


Biconvex lens image from <code>http://en.wikipedia.org/wiki/Lens_(optics)</code>


So far I have tried to add contour to the lens shape which could be reflections from a light source very far away. The dark background colour reduces the complexity of any refractions through the lens as suggested by @Dom.



Lens attempt on a dark background.



Answer




Let's make a google search (images): https://www.google.com/search?q=crystal+logo


1) You can see how difficult is to make an abstraction of a crystal. Verey few logos succeed there.


2) "How to make an illustration" depends on what kind of illustration do you want. The key word here is "style".


Depending on what is this approach the look could be called a diagram, a cartoon, illustration, cute, amazing, etc.


Let's make another search (images) https://www.google.com/search?q=crystal+vector


That is better but the problem is that you don't need faceted crystals which are easier in some cases.


3) It is obvious you don't want this dull diagrams of lenses: https://www.google.com/search?q=lens+diagram



Here is my aproach


Actually I'm starting to use this style for some diagrams I'm doing myself.


If we need a realistic image I would use a 3D image as a base.



But if we don't need the realism, just a cuter diagram I'm using a simple shadow (s) and a reflection (r) (A)


But I can not see the reflection so I need some base color (B)


And I am adding a "sandblast" (C)



But the trick is that all those elements are actually using transparency. It is a lens after all. So If I use a darker background I know I can show light in the next steps. (You can see that the beam of light is behind the lens)




I can play with the light instead of those boring yellow arrows.


enter image description here


All transparencies are simple gradient ones (I'm using Corel Draw here but you have them in Illustrator and Inkscape)


For the last one I'm using a starting object and a final object to give shape to the beam, but there are other approaches to that.


Edited some time later.


I'm adding an image on how to make a simple typical glossy button.


You can see here how the different simple elements combine together.


enter image description here


An additional variation regarding style is adding some blurs on the same objects we had before.


enter image description here



No comments:

Post a Comment

technique - How credible is wikipedia?

I understand that this question relates more to wikipedia than it does writing but... If I was going to use wikipedia for a source for a res...