ImmunoGenomics
Delivering an authentic brand and technologies that facilitate patient access to life saving cancer survival information.
Built in Drupal 8
Cancer is War
The goal of this project was to design and develop an education platform for physicians and patients along with providing treatment recommendations that offer the best chance of survival.
Working directly with a board of oncologists, GrahamAgency advised on technical solutions and strategies for product vision and development. We created their entire brand and went through an in-depth user experience UX process for their digital platform that later was developed into a Drupal 8 website.
In addition, we extended their marketing by weaving their brand message across social platforms along with setting up analytical and marketing tools.
Background
With full expertise in oncology, immunology, and genetics this team of doctors joined forces to provide patients with treatment recommendations to give them the best chance of survival.
User Research and Testing
Problems. Needs. Goals. Purpose. Ideate.
Before the company hired GrahamAgency they were solely servicing and educating patients the traditional way through medical referrals.
Listening to the doctors creative ideas on how to educated patients helped us refine purposeful design rather than simply creating something for the sake of creating it.
We developed a scope of work that applied this purpose and took into account any technical and product limitations.
Our research encompassed:
- Understanding the user goals and needs
- Determining feature purpose and reasoning as to have meaningful interactions at every touch-point
- Conceptualizing and ideate technically solutions
- Determining the success of the tasks measured
- Prioritizing the delivery and development of features and interactive elements
We believe effective communication fosters trust with others and provides clarity and direction.
Creating a Brand
Trust. Authenticity. Loyalty. Values.
As a fully funded startup, this client had no brand identity or web presence. GrahamAgency communicated with teams across multiple departments to understand vision, values, mission, objectives, and terminology.
Throughout the project we brainstormed, ideated, created, and delivered the following branding elements:
Logo Design and Styles
We designed this client a logo that is a hexagon molecule used in the structure of DNA. It is also an acronym used in immunology, the IG.
Brand Narratives
GrahamAgency provided Subject Matter Experts (SME) that worked directly with doctors. We then created catchy tag lines and a compelling brand narrative.
We delivered a brand that is a bold symbol of the company, industry, science, and founders. Through voicing values, and patient and doctor stories we were able to convey authenticity.
Empathizing with users: Personas
Our research identified 5 types of users. These included cancer patients, caregivers, person wanting information to avoid cancer, doctors wanting medical resources, and doctors wanting to join network.
As to gain a perspective similar to the end users, we developed a series of personas that defined the demographics, goals and needs, frustrations, behaviors, and personality of each user.
Design process
Wireframes - User Journeys - Interface Designs - Prototyping
GrahamAgency detailed every step of the user experience. From low-fidelity wire-frames, user testing, user feedback and adjustments to high-fidelity prototyping, the design was rigorously tested at every step of the process to ensure a tightly focused digital experience.
We applied designed thinking methodologies through each phase of the design process.
An empty framework: Wireframes
Separating aesthetics from site structure.
Based on the scopes of work, we defined the site architecture that gave solutions to the needs and goals that included:
- The defining of different pages that would cater to the different needs of the variety of users, such as Patient and Doctor.
- Areas for video and article libraries
- Defining teasers blocks that pull latest videos and articles and which apply to what users
- Functional and interactive defining of elements
- Page layouts for different content types
- The lack of a existing content or website meant we had to predict future growth within the design.
During the wireframing phase we conduct extensive user testing to continually validate the concept.
Detailed designs from low fidelity to high fidelity
For the brand, we wanted to create a refreshing, minimalist and clean UI that conveyed trust and authenticity.
As the project progressed the design fidelity increased and functionality expanded. These continual iterations then become the user interface design.
Prototyping and presenting user journeys: User testing and feedback
We created interactive prototypes that enabled us to gather feedback from the client and other departments. This gave everyone the opportunity to interact with the design and make comments.
Architecture: Site maps, Features, Behaviors. Functionality
As to prepare for the development phase we produce the following:
- Site maps that showed the product hierarchy
- Defining every components - feature, behaviour, label and display
- Technical development defining - how these components and pages will be built into the website
The gaming feature
Applying the Successive Approximation Model SAM framework
Preparation - Iterative Design - Iterative Development
The doctors wanted a fun interactive way for people to understand how cells flight cancer within the body.
Due to this being just one interactive gaming feature, we saw best to apply the SAM framework allowing for more rapid design processes for the design and build of this instructional design gaming feature.
We prototyped, revisited and reviewed as to be technically correct and accurate with information presented in this learning app. The final interactive product was built into the clients Drupal website with layered svg elements manipulated with jQuery on each click of elements.
Website Build
Best coding and development practices all in-house agency standards.
This client had no web presences and an urgent request to have something up quick. We promptly delivered a microsite while the main Drupal website was in development.
GrahamAgency constructed the website architecture – including pages, layouts, types, blocks, and paragraph elements – also referred to the unbeautified raw elements. We focused on efficiency - easy page edits and no content redundancies. The aesthetics were custom coded.
Built in Drupal 8
We optimized programming code by using SASS, global variables, mixins, and functions etc.
Managed Hosting
We provided 2 environments. User Testing Environment (UAT) and Production. UAT allowed us to push code to an environment for testing and client approval before making it live on production.
Infrastructure Management
We provided this client with module and core security updates and database monitoring.
GrahamAgency delivered a robust, scalable, custom Drupal website. Coded completely in-house to align with our agency programming standards. In addition, we provided managed hosting. Hosting our clients website allowed us to easily deploy, scale, monitor and secure the web application.
Branded Videos.
A series of mini documentaries were filmed and required edits that aligned with the company's messaging.
We assisted post-production editors in including the clients brand and identity to the videos, by providing content overlays and creatives.
As a result, GrahamAgency assisted in developing a heart moving catalogue of videos, strengthening the company's authenticity and patient trust.
Extending Marketing
As to set the client up entirely with marketing tools ready to go, GrahamAgency created newsletter subscription lists linked to the website, marketing platforms consistent with their branding, and analytical tools to monitor website traffic.
Newsletter Subscriptions
GrahamAgency created subscription forms of the website linked to a mailing list that allowed the client to start broacasting marketiing emails.
Social Media
We setup all social media marketing platforms consistent with brand colors, styles, and narratives.
Analytics
GrahamAgency linked marketing analytical tools to the website. Allowing our client to monitor website traffic, engagements, campaigns, and ROI.
It's not about the amount of followers, it's quality and relevance that matters.
In summary
GrahamAgency delivered the product solution using Drupal 8, with advanced customizations, and our user centered design UCD methodologies. We extensively researched, designed and developed the high performing, user-centred experience the company required to take them into the future.