Website | Spherica Lens

A website focused on selling and disseminating information about optical lenses.

Role

UX/UI Designer

Industry

Health

Scope

Website development (UX and UI)

Stage 1. Briefing

The client contacted us to create a website for an optical lab. The challenge with this site was to develop a website that would be accessible to different types of users, including optical salespeople, customers, and ophthalmologists; therefore, the site needed an accessible layout and language to engage with these different audiences.

The request was for a modern, accessible, intuitive, and informative website that could also be used for appointments.

Stage 2. Sitemap and Wireframe

The Spherica Lens sitemap was structured around a clear content hierarchy, organizing the lab’s core offerings into intuitive categories: an institutional section (About Us, Experience, Equipment), a product architecture organized by lens type (Multifocal, Bifocal, Single Vision), a dedicated section for proprietary technologies (8K, Wear Fit, Smart Blending, Continuum Design) and treatments (Reflexa, Blue Less, Hard Coating, among others), plus complementary sections such as a blog (“Your Eyes”), pre-registration, and contact information. This structure was designed to guide users, from prospective clients researching lens options to those ready to make a purchase, through a logical, seamless path, balancing educational content about the technology with clear conversion points throughout the journey.

link to sitemap:
https://www.figma.com/design/oScuNAkc8AN9ScYCWYx1Md/UX---Spherica-Lens?node-id=0-1&t=XxKKQ3xKHi2f3Spv-1

Wireframe (home)

Stage 1. Briefing

The request was for a modern, accessible, intuitive, and informative website that could also be used for appointments.

Stage 2. Sitemap and Wireframe

link to sitemap:
https://www.figma.com/design/oScuNAkc8AN9ScYCWYx1Md/UX---Spherica-Lens?node-id=0-1&t=XxKKQ3xKHi2f3Spv-1

Wireframe (home)

Stage 3. UI Home and Components

After presenting and getting the sitemap and wireframe approved by the client, I began designing the high-fidelity screens, starting with a single page: the home page. At this stage, I had already applied the client’s visual identity and created the main components so I could move on to designing the rest of the site’s screens.

Stage 4. High-fidelity prototyping of the website's other screens

After presenting and getting the high-fidelity homepage approved, I moved on to creating high-fidelity prototypes for the rest of the website's screens.

link para o protótipo:
https://www.figma.com/proto/itfC95kfxNvmHvLDsho4kQ/Spherica---deriva%C3%A7%C3%A3o?node-id=2-27308&viewport=-1109%2C878%2C0.17&t=ycBOyG4Rv0ngsWOg-1&scaling=min-zoom&content-scaling=fixed&starting-point-node-id=2%3A27308&page-id=1%3A2

Reflections

Designing the Spherica Lens website was both a rewarding and challenging experience. As an extensive site with multiple product lines, technologies, and treatments, it required careful information architecture to keep the experience navigable without overwhelming the user. One of the biggest challenges was crafting a neutral, accessible language and visual structure capable of speaking to different audiences, from end consumers exploring lens options to opticians and industry professionals, ensuring the content remained clear, inclusive, and easy to understand regardless of the visitor's level of familiarity with the product.