Preview image. Unlock full-res
Staff or professional directory layout using overlapping circular avatars in blue, green, and orange tones, each paired with name, specialty, and gold-star ratings.
Summary
A clean professional directory grid uses overlapping solid circles in varying blue and green hues as avatar containers, each paired with doctor name, specialty, and gold-star rating.
Visual description
A light gray background holds an organic cluster of overlapping circular elements. Each circle contains a portrait photograph (doctors and medical staff of varied backgrounds) or is colored solid (bright blue, teal, lime green, soft orange, or pink). White name cards with light-gray text are positioned around the cluster, identifying each person with a title like "Dr. Ali al-Qassim" and a specialty like "Surgery Pul." Below each name, five small gold or orange stars in a rating badge. The circles vary in size and overlap asymmetrically, creating visual rhythm and movement despite the stationary portraits.
Key takeaway
Overlapping circles break the rigid grid pattern while keeping the layout instantly scannable. Color coding by circle tone adds visual interest without introducing clutter. Gold star ratings leverage a universally recognized trust signal.
Reuse notes
Ideal for medical team pages, healthcare directories, and professional service listings. The overlapping technique avoids the monotony of aligned grids. Works best when the number of people is 6-12; too many circles lose clarity.
