📆 Improve campaign visibility with a calendar view

🪶 Feathr is an all-in-one marketing platform tailored for nonprofit organizations.

The app offers tools and features to help nonprofits manage and optimize their marketing campaigns. One of the key features of Feathr is the All Marketing view, which provides users with a comprehensive table of all their campaigns.

However, this table format lacks the ability to easily identify timing or date-related issues or opportunities within the campaigns, hindering user efficiency and decision-making. 🙁

💡 To address this issue, we proposed designing a calendar view as an alternative to the table format.

This calendar view would be toggle-able, allowing users to switch between the table and calendar views based on their needs. The calendar view would include all the data filters available in the table, providing users with a comprehensive and flexible view of their campaigns.

Our approach involved several key steps:

  1. 🧐 Research and Inspiration: We began by conducting research and browsing through design inspiration on Mobbin to understand best practices for calendar views and gather ideas for our design.


  2. 🏗️ Low-Fidelity Wireframes: We created low-fidelity wireframes in FigJam to visualize the initial concept and layout of the calendar view. These wireframes helped us quickly iterate and refine our ideas.


  3. 🔄 Design Iteration: With the wireframes as a guide, we developed more detailed screens for the calendar view, focusing on usability and visual appeal. We incorporated feedback from internal reviews and stakeholders to enhance the design further.


  4. 🧪 Usability Testing: To validate our design decisions, we conducted usability tests with a small group of super users. We used Dovetail to run these tests and gather feedback, which we then analyzed to identify any usability issues or areas for improvement.


  5. 👨‍💻 Prep for Development: To prepare the feature for development, we ensured that our design files were organized and detailed. We leverage Dev Mode in Figma to provide comprehensive design specifications, including measurements, colors, and interactions, to guide the development process. Additionally, we collaborated closely with the development team, providing them with the necessary assets and support to bring the design to life effectively.




The calendar view for the All Marketing campaigns table proved to be a valuable addition, providing users with a visual representation of their campaigns' timing and schedules. 🎉

The implementation of the tabs approach between the table and calendar views allows users to choose the most suitable view for their needs, enhancing their overall experience with the platform. The design received positive feedback from users, indicating improved visibility and usability compared to the previous table-only view.