Empower Admin with AI
Neutopia is a start-up platform that enhances community engagement in learning and development. It aims to build more connected communities through accessible technology and education. This year’s update empowers community admins to create engaging content with features like event promotion (integrated with Eventbrite), a robust Learning Management System, and content sharing from over 2000 platforms. Personalized content feeds for users further enhance engagement and targeting.
Service
UX Design
Client
Neutopia
Year
2024
Neutopia
Community Platform
THE CHALLENGE
The project brief revealed four key touchpoints crucial for enhancing the admin experience.
-
Creating Engaging Content by Empowering Admins to Create Professional Posts -Enable admins to create professional posts by integrating tools like Canva without needing graphic design skills.
-
Learning and Iteration: Improved outcomes by refining strategies based on past campaigns. - Fostered continuous improvement by learning from past campaigns and refining strategies.
-
Empowering the Organization in content creation - Empowered members excel in content creation, event management, and community engagement.
-
Visibility and Impact: Boosted visibility to showcase successes and milestones - Improve visibility of outcomes, allowing admins to showcase successes and celebrate milestones.
MY ROLE
I created a clickable prototype using Figma and presented my design concept to the CEO, CFO, and the team’s new product designer. My role encompassed product analysis, strategic planning, conducting user interviews, and iterative design improvements to refine the solution.
KICKOFF
Stakeholder Interview
The team explored the development and relevance of Neutopia with stakeholders(CEO, CFO), an educational platform for corporate use, focusing on the user experience, engagement, and the potential usage of AI to enhance the admin experience.
Insights from stakeholder interview (OBJECTIVES)
-
Leveraging familiar design patterns(intuitive), such as Canva, for an easy-to-use platform from the initial start.
-
Automating administrative tasks, providing real-time analytics, and enhancing the overall user experience to transform community admins into superheroes.
-
Collects data on every engagement touchpoint across content, events, groups, and learning playlists to provide valuable insights to the customer organization.
DELIVERABLES
-
A 15-minute pitch presentation to be delivered to the client summarizing key findings, insights, and proposed solutions.
-
A clickable prototype
-
Documentation to describe the functionality in your prototype (I.e. Dev Hand-off)
THE DISCOVERY
Heuristic Analysis
To understand the product’s current state, I began with a heuristic analysis to identify gaps and pinpoint areas for enhancing the admin experience. ( I followed Nielson Norman Groups Evaluation Workbook)
1. Visibility of System Status.
-
Does the design clearly communicate its state?
-
Is feedback presented quickly after user actions?
Issues: Lack of Distinctive Sidebar Icons Hinders Navigation Efficiency
The sidebar icons lack distinctiveness, making it difficult to differentiate between each menu. Currently, users must hover over the icons to see the names, which slows down navigation. Improving the visual clarity of the icons would enhance usability and help users quickly identify where to click.
Recommendations: Add Icon Labels to Improve Navigation and Usability
To improve clarity, consider placing the names of the icons. This will help users quickly identify each menu option without hovering, enhancing overall navigation and usability.
2. Error Prevention
-
Does the design prevent slips by using helpful constrains?
-
Does the design warn users before they perform risky actions?
Issues: “Publish” Button Redirects Users, Causing Disorientation
The "publish" button currently redirects users straight back to the homepage with the published content, which can be disorienting.
Recommendations: Add Preview Feature for Smoother Review Before Publishing
Preview feature to check the contents before publishing. This allows users to review directed to the homepage, ensuring a smoother and more intuitive experience.
3. Flexibility and Efficiency of Use
-
Does the design provide accelerators like keyboard shortcuts and touch gestures?
-
Is the content and functionality personalized or customized for individual users?
Issues: Inconsistent Post Buttons Cause Confusion and Inefficiency for Admins
Admins must search for the correct button to post content in different categories, which can be confusing and inefficient.
Recommendations: Consolidate Post Buttons into a Single, Intuitive Interface
A button for the posting process into a single, intuitive interface that allows users to select the category before submitting their content.
DESIGN INSIGHTS
Stepping into Admins’ Shoes
Before jumping into the design and sketch, I had time to research and think about their job and main concerns in keeping the community engaged.
According to Higher Logic, there are several essential tasks for community admins, including:
-
Running reports to view community metrics,
-
Updating its join and view permissions,
-
Adding and removing Community Admin access to/from members,
-
Inviting (and, if allowed by Super Admins, adding) members to join,
-
Restricting and removing current members;
-
Emailing members;
-
Moderating Discussion posts and Library entries;
-
Managing community events;
-
Managing any community Volunteer Opportunities;
-
and more.
From this list, I identified opportunities to support admins by automating tasks such as generating community metric reports with AI and automatically emailing communities when posting content.
In addition, I found a few tactics Community Admins can use to keep the momentum going from the Yammer report.
-
Welcome and encourage new members to introduce themselves to the community.
-
Ask questions and mark the best answer
-
Tag an expert to draw their opinion or insight into a conversation.
-
Share other relevant conversations happening in the network with the community.
-
Add topics to conversations. Create a #topic related to your community initiatives.
-
Post weekly roundups or related content to the community.
-
Praise community members for the behaviour you'd like to see replicated.
-
Don't leave a post unanswered to your community! If you're unsure of the answer, @mention someone who may know.
-
Add relevant content—upload files and notes to add context to conversations.
-
Use Announcements for important updates that need to reach the entire community. This will prompt an email and a notification to all community members, so only use Announcements for important updates. Be sure to provide supporting documentation or links.
From this list, I realized that maintaining consistent member engagement requires regularly creating relevant content and using appropriate tags.
BUILDING PROTOTYPE
Dasgboard & Create Content Page Design
Click the image to see the Figma file
My Inspiration Board
- Personalize your data, AI recommendations for content creation
I designed an inspiration board to ease the burden of constantly uploading content, provide feedback on posted content, and highlight popular trends in similar communities. The board includes AI features that suggest content based on community popularity display similar content and analyze member engagement.
To support new admins, I added a Q&A section in the top right corner, where AI can assist with platform-related questions, enhancing their ability to use the platform effectively.
Create Contents (Before->After)
- one click to create any content, personalization/branding with Thumbnails,
I simplified content addition by combining drag-and-drop and URL-paste features with AI integration to refine text for relevance. I also added a thumbnail upload section for custom covers, ensuring consistent themes. A key feature allows admins to create content from anywhere via the side menu, specifying where it should be displayed.
USABILITY TEST
Test, Reflect, and Iterate
I had the opportunity to test my design with some of Neutopia’s clients and my mentor. Their valuable feedback helped me refine the design for the final presentation.
My mentor suggested that the dashboard design was too busy and recommended separating sections into different pages, such as having recommendations on one page and the analysis report on another. I was initially unsure about this approach, as I believed displaying all analyses together on the dashboard was more efficient for quick access. To resolve this, I decided to test both versions with users.
The feedback from users indicated that they preferred having everything on one page. They found it convenient to see all the information at a glance, which made sense for a dashboard. Based on this feedback, I retained the original design for the final presentation.
Dashboard Insights
User Confusion
-
Unclear Section Heading Causes Confusion and Hinders Navigation: A clear heading or title for this section will help users understand its purpose more easily and navigate it more effectively.
-
Ambiguous “Add Content” Button Causes User Confusion: Ensure that the “Add Content” button has descriptive text, making it clear what action it performs (e.g., “Add New Content” or “Create New Item”).
Analytics Highlights
-
Simplify Visitor Flow Graph: Reduce complexity by making the visitor flow graph more digestible. Focus on highlighting key data points and using a cleaner layout or fewer elements
-
Add Report Download Option: Since the personalized analytics feature was appreciated, offering a download option for reports would provide more value and flexibility for users.
Create Content Insights
Layout Improvement Suggestions
-
Reduce Excessive Spacing: Implement a more compact layout by minimizing padding and margins while maintaining readability. Consider using a responsive description box that dynamically adjusts its height based on content length to optimize space.
Thumbnail Section Enhancements
-
Ensure Consistent Box Sizes: Standardize the size of thumbnail boxes to create a more visually uniform layout and eliminate inconsistencies that may confuse or distract users.
-
Automate Cover Image Generation: Introduce functionality for automatically generating cover images based on the content or relevant elements, reducing manual work and ensuring a consistent visual style.
-
Reorganize Content Areas: Move the thumbnail below the drag-and-drop area for a more intuitive workflow and better content organization. This placement prioritizes user actions and maintains a logical flow within the interface.
OUTCOME
Solution Refinement
Home(dashboard) Features
The primary goal of the redesigned Dashboard is to empower admins in their content creation journey by overcoming challenges related to maintaining motivation and consistently generating fresh ideas. The enhanced Dashboard aims to serve as a comprehensive hub where admins can:
-
Plan Their Tasks
-
Celebrate Achievements
-
Ask Questions
-
View Suggested Content
-
Check the analytics Results
Click the image to view it in a larger size.
Top Section
-
Task Management: Enable admins to set tasks, manage deadlines, and view schedules for seamless organization.
-
Achievements: Highlight milestones and consistent engagement to boost motivation and celebrate success.
-
AI Support: Offer instant assistance and recommendations via an AI assistant to enhance productivity and accessibility.
Middle Section
-
Content Discovery: Showcases recent and popular content from the user’s community and beyond, with AI-driven suggestions tailored to their interests.
-
Personalization: Enables custom tags for improved organization and precise content filtering.
Additional Features
-
Sidebar Menu: Includes visible text labels to improve navigation and eliminate the need for users to hover to identify options.
-
Create Post Button: Provides a prominent, easily accessible button for adding content from any page, streamlining content creation across all categories.
Bottom Section
-
Analytics Highlights: Offers customizable time periods and tailored insights, allowing users to adjust data and preferences for a more personalized experience.
Refine grammar, adjust text length or tone, and add AI-generated images
Post (Create Contents) Features
Top Section
-
Enhanced Drag-and-Drop Functionality: Effortlessly drag-and-drop or paste a webpage URL to import its content. The platform automatically generates a dynamic cover image, which you can personalize by uploading your own or leveraging Canva’s intuitive thumbnail creation tools.
Middle Section
-
Text Import: The platform automatically imports content but may sometimes include excess text. An integrated AI tool helps you easily streamline and refine it by:
Click the image to view it in a larger size.
The post page allows easy content import, automatic cover image generation, and AI-driven text refinement. Personalized tags help with organization, and users can assign posts, save drafts, preview, schedule, and receive notifications.
Tagging System
-
AI-generated tags are automatically suggested, along with additional relevant options to choose from. A personalized tagging feature further enhances the experience, offering tailored tags based on user preferences and content.
Destination Assignment
-
Easily assign your post to its destination or add it to a playlist, all on one streamlined page for a seamless experience.
Saving and Previewing
-
Draft Saving: Save your content as a draft or preview it before publishing to ensure everything is perfect.
-
Preview Features:
-
Send email notifications while creating the post.
-
Schedule content for future publication.
-
Use analytics insights to determine the optimal posting time based on community activity.
-
PRESENTATION & FEEDBACK REVIEW
What’s Working and Opportunities for Growth
The prototype of the Neutopia platform received a positive response from the CEO and Chief product designer, but there are also some improvements to work on.
Your presentation was fantastic! It was well thought out and beautifully executed.
I love how you used “How might we” statements to reframe the problem. It’s a great approach to problem-solving.
The “My Inspiration Dashboard” concept is brilliant. It felt so personal as if it were speaking directly to me. The idea of a personalized welcome message is fantastic.
I suggest separating the analytics from the personal dashboard. There’s a lot of information there, and having a dedicated section for analytics could make the dashboard cleaner and more user-friendly.
Customizing AI instructions for rewriting is a great feature. It adds flexibility and enhances the user experience.
When users want to download analytics, it’s important to ask why. Understanding their needs can help us integrate those features directly into the product.
You’ve done a fantastic job, and there are some great product ideas here. Thank you for your effort!
Libby Graham,
Chief Product designer
First, congratulations on taking bold steps with the UI and font design—it’s exciting to see such a fresh approach. The side menu and font sizing create a youthful, inviting feel, and I love how this impacts the overall brand experience. It’s not just functional; it’s engaging and encourages exploration.
I’m also impressed with the streamlined content creation process. By centralizing content addition into one place, you’ve simplified the user flow, a smart and efficient design choice. The dashboard with large content tiles is an effective way to highlight popular content and drive engagement.
You’ve made some great design decisions, and it’s clear a lot of hard work went into this. The heuristic slide was beautifully done, and I can’t wait to dive into the details. Overall, this is an impressive and well-executed project—great job!
Jamie Engel
Founder of Neutopia
EVALUATION & REFLECTION
Reflection
I received valuable feedback on my presentation, particularly regarding the busy dashboard design, which my mentor had identified as an area for improvement. I initially tested the approach of displaying one element at a time, but the result didn’t meet my expectations, so I decided to gather user feedback. The users responded positively, appreciating the integration of recommended content and analytics, and noted that the layout felt less overwhelming. Both my mentor’s and the users’ feedback have been invaluable, and moving forward, I aim to refine the design to make it visually appealing and less cluttered. Although the usability tests were limited in number, I plan to conduct further testing to refine the design based on these insights. Research suggests that interviewing 5 to 6 participants can provide around 80% accurate insights, so I’m eager to continue iterating.
Overall, this has been a valuable learning experience, particularly in exploring interactions and prototyping in Figma.
More Projects
HSBC
FEA
Bottega Veneta
DATACOMP 2022