PPTA - Plasma protein therapeutics association | Web development
Carol Loiola
Web Designer
Webflow Developer
Figma
Webflow
Project
Process
1. Webflow setup, design implementation & custom development
2. Custom development, CMS and data integration
3. Testing and debugging
4. Launch
5. Maintenance and support
Challenges
High performance while having a complex design
Structure of CMS collections
Outcomes
Client support and CMS collections
Project
The Plasma Protein Therapies Association (PPTA) advocates for safe, accessible treatments for rare diseases and medical conditions, representing plasma collection centers and manufacturers of plasma-derived therapies.
PPTA sought a website redesign to boost awareness of plasma donation and its lifesaving therapies, while enhancing their association’s profile. The new website needed to be modern, vibrant, user-friendly, and interactive, catering to both members and the general public.
This project was developed in collaboration with YUMEDA Studio. We handled both the UX/UI design and development; however, my responsibility was solely on the development side.
Process
1. Webflow setup, design implementation & custom development
Creating and setting up the webflow project.
Building layout and structure of pages.
Ensuring responsive design across devices.
2. Custom development, CMS and data integration
Custom code implementation, such as text animations, CMS-driven sliders, and WebGL backgrounds.
Setting up and creating CMS collections.
Adding all data to the website.
3. Testing and debugging
Thorough testing and debugging processes to ensure functionality.
Continuous performance improvements.
4. Launch
Setting up and connecting to custom domain.
Deploying the website for public access.
5. Maintenance and support
Ongoing maintenance for performance and security.
Dedicated customer support for CMS collection management and comprehensive documentation.
Challenges
High performance while having a complex design
Integration of complex 3D elements and animations into the website, overcoming challenges and investing considerable time to ensure optimal performance.
Structure of CMS collections
Implementation of a well-structured CMS collections framework for the resources and media comprising over 100 additions across multiple pages. Our goal was to create a flexible structure that allows the client to easily add or modify content in the future.
Outcomes
The extensive content reorganization, targeted user pages, complete redesign, and robust development aligned with the company's vision have significantly improved the user experience.
But let's allow the numbers to speak for themselves:
+38% Page views
+27% Sessions
-8% Bounce rate
Client support and CMS collections
Certainly, one of the most important aspects of a project is communication and effective interaction with the client.
Listening and being flexible to adapt and implement your work in a way that aligns with their needs.
That's precisely what we did at YUMEDA studio for the PPTA project.
The client expressed the need for dynamic content across various sections and pages of the website. On the website, we can observe 14 collection lists, with the client actively updating at least three of them.
We understand that Webflow is a highly user-friendly and intuitive platform. However, even so, someone unfamiliar with the platform or similar technologies can easily feel overwhelmed.
Therefore, to ensure the project's success, I devised a personalized approach to convey this information and genuinely educate on the operation of various critical aspects of the system.
Here are some of the accomplishments:
- Firstly, the initial step was the creation of a website that outlined a step-by-step guide on using the editor.
- To elucidate the document, address queries, and maintain ongoing support, we conducted a walkthrough session with the client. It was a call where I elaborated on the step-by-step instructions in detail.
- Finally, considering the complexity of the flow with abundant information and nuances, I also created a document on Notion explaining the collection lists where the client would be actively making changes.
The project delivery took place almost a year ago, and these documents, along with continuous communication with the client, have been and continue to be essential for the project.
I persist in adapting and listening to their needs to achieve the best possible outcome.
Thus, I share this to underscore the significance of communication.
Communicate. Listen. Implement.
