Design a loading icon.
---------------------
ILLUSTRATOR
PHOTOSHOP



Introduction

Loading icons can mean many things. Usually it refers to the processing time for a device to display data. From rectangular bars to circular paths, loading icons are represented as a continuous cycle being completed overtime. This icon signals to the user not only to wait, but to acknowledge that an operation has started, and is working towards an end. 




Research

Despite the infinite combinations of visual techniques that diversify the look of loading icons, many are read in the same way — often either by juxtaposing a start/finish condition or by repeating the same circular loop. 

As an attempt to diverge from those concepts, I based my design off reticles: the linework on the lens of scopes to guide visual examinations, usually for firearms or telescopes. Rather than treating the icon as a cyclical representation of computer processing, I generated my design to mimic the relationship between user and screen.



Just as reticles are used to guide the user to a specific target, the computer is guiding the user to a specific screen. When loading, however, the icon becomes the buffer that intercepts the user from seeing what they want to see. This idea was the motivation behind my animation for the symbol—a blockade preventing the user from seeing what the reticle is meant to help you see; the center of the lens. 





Implementation

After simplifying the lens to its core crosshairs, I animated the lines to collide with one another, so that the center is always interrupted. 

No beginning-to-end; no circular cycle. This is a loading icon about sight, focus, and how loading is an obstacle for both.