Web Experience Design,
‍Shankara Cancer Hospitals

Research & Analysis

Project Planning & Execution

• We not only designed the requirement, but developed it too. We not only ideated with the stakeholders, but planned it too. We not only executed the project, but defined the way various teams collaborated, exchanged information, content and media too.
• We spent time guiding the non-tech-savvy staff, content writers and teams in understanding how videos are shot, why designs are executed a certain way, how content writing needs to align with the design work and vice versa.
• We built tracking sheets, planning sheets, mechanisms of check-lists and processes, to ensure smooth exchange of information, process, design specs, content specs, content, media, etc., all happened as per the quality standards we had initially committed to the stakeholders.
• We dedicated time and resources shooting videos, taking photos of the doctors, guiding the in-house media team of the Hospital to scale the process and quality standards we had set. This resulted in one of a kind output that was aligned with consistent colors, design language, eventually leading to a streamlined user experience for various types of visitors - patients, doctors, medical professionals, donors and more.

Colors & Typography

The design team crafted a vibrant, confident color palette to bring a sense of positivity to the sensitive subject of cancer, and paired it with clean, modern, highly readable typography—ideal for presenting long-form content like procedures, guidelines, and doctor profiles in an engaging, accessible way.

UI Design

Combining multiple websites with a vast range of interactions, we designed a comprehensive and robust yet multi-device user interface components. The set of components range from buttons, form components, to panels, cards, accordions, sections, menus, tabs, tables, and many more. These were inline with the project's colors and typography, legible and most of all, accessible.

Illustrations & Iconography

We created custom illustrations and icons to enhance the visual experience across the web portal. These elements were consistent in style and color, adding a bright, positive touch to the site while maintaining the seriousness of the content. The iconography were designed with different types of necessities across the websites.

1. Site/Feature Icons
2. Card/Information Icons
3. Department Icons
4. Page Icons / Illustrations

1. Site/Feature Icons

These icons represented features or USP of the brand/business. The icons here were designed to go in-line with the brand colors and uphold the meaning of the colors through minimalistic illustrations that represented the concepts of features being illustrated.

2. Card/Information Icons

These icons mostly served as secondary visuals for important bullet points, parameters or take-aways of various sections across the website. These were illustrated to ensure the bullet points were visually grasped faster by the visitor.

3. Department Icons

40+ departments were illustrated through minimalistic icons. These icons went through extensive understanding of what each department specialises in, and represent them visually so the meaning of the departments are even more easily understandable by the visitors/patients. As preferred by the stakeholders, we also introduced a variety of colors for each department, eventually enforcing those department pages to be influenced by the colors of their respective icons.

4. Page Icons/Illustrations

Most pages of the websites mostly talked about various topics belonging to a broader subject/categorisation of information. We introduced simplified illustrations that were fresh, colorful and conceptually meaningful, to represent each page. This enabled visitors who were often from non-medical background, to understand the gist of the page/concept easily.

Glimpse of the Output

As part of an on-going work engagement with Sri Shankara Cancer Foundation, we have currently ideated, conceptualised, designed and developed 3 websites. Here are a few screenshots: -

1. Hospitals' Website

2. Foundation's Website

3. Careers Portal

Responsive UX Design

The websites were built to be fully responsive, adapting seamlessly to different screen sizes, including desktops, laptops, tablets, and smartphones in both landscape and portrait modes. Rigorous testing ensured that every feature and page functioned perfectly across various browsers, devices, and resolutions. Irrespective of where the patients visited the hospital website from, it was designed to look and behave appropriately.

Project Features

Mobile Quick Launch Menu

Dynamic Content with Filters

Key sections such as Doctors, Departments, Facilities, and Blogs were powered by a dynamic CMS, allowing for easy search and filtering of content. This made it simple for users to find the information they needed quickly and efficiently.

Interactive Content

Dynamic Forms

Forms were integrated with the backend, dynamically connecting with CMS data to provide a more interconnected experience for users. This allowed for more efficient form submissions and responses, improving the overall usability of the sites. The forms varied from search, newsletter subscription, applications, tax receipt request forms, etc.

Summary

This extensive project required months of careful planning, design, and execution. The challenges were significant, but our team at Spindigo rose to the occasion, delivering a final product that was well-received by the hospital stakeholders. The positive feedback and ongoing engagement with the hospital speak to the success of the project, and we look forward to continuing our partnership in the years to come.

• Managing Diverse Stakeholder Expectations
  Working with multiple stakeholders from different branches of the organization taught us the importance of aligning diverse perspectives. Each entity had different needs and priorities, which required clear communication and a structured approach to maintain consistency across the project.
• Navigating Legacy Systems and Information Overload
  The project involved organizing over a decade’s worth of accumulated information, which highlighted the need for deep discovery sessions and careful planning to avoid overwhelming users while ensuring all critical information was accessible and easily understood.
• Balancing Sensitivity with User Engagement
  Designing for a cancer hospital meant dealing with sensitive topics, which challenged us to create a website that was both empathetic and engaging. We learned how to carefully craft messaging and visual elements to maintain a balance between conveying the seriousness of the subject and fostering a sense of hope and positivity.

These lessons reflect the deeper, more nuanced challenges we navigated during the project and how they shaped our approach moving forward.