DIAL New Design With Tech Constraints
DIAL (Digital Impact Alliance), which is part of the UN Foundation, is developing a platform for open source solutions for developing countries. They are launching a new functionality called Playbooks to serve as a guide for creating and distributing step-by-step instructions to accelerate the way DIAL can coach their partners.
My Role
I synthesized raw data from a stakeholder kickoff and competitive audit to create journey maps. I designed low fidelity wireframes to propose new features, presented them to my team, and created high fidelity annotated wireframes based on the features that received the most votes.
Client
Users
Content Creators: DIAL staff or partners who are creating playbooks for others to use
Content Consumers: DIAL partners (e.g, government ministers, project managers) looking for a guide on how to do their work
Goal
To create features for DIAL Playbooks to enhance the user experience.
Research Methods
Stakeholder Kickoff
Competitive Audit
Journey Map
Feature Cards
Feature/Tech Scoping
Dot Voting
Kano Model
Annotated Wireframes
Tools
Sketch
InVision
Zoom
Slack
Mockuuups Studio
Powerpoint
Google Sheets
Google Forms
Pencil and Paper
Competitive Audit
Goal: As a method of preliminary research, my team completed a competitive audit by examining similar tools to identify features, flows, processes, and UI elements that are similar, different, or which could be valuable for DIAL Playbooks.
Insights: The criteria we determined most important were
Search feature
Filter/refine search
Simple navigation
Intuitive Playbook Layout
Includes Playbook summary/intro information
Multiple entry points to access data
Click to view competitive audit results.
Journey Maps
Goal: After gathering information from the stakeholder kickoff and competitive audit, I created journey maps for the two primary user groups to visually model the existing process that Playbooks is meant to facilitate, as well as the future state with the proposed new features.
Insights: Journey maps were not the best reporting tool for this project because I had to hypothesize a lot of the touchpoints and feelings of the users. If we had done contextual inquiry sessions with the users prior to creating the journey maps they would have felt more accurate and complete.
Feature Cards
Goal: Based on the research, I prototyped ways to address the goals of DIAL through new or expanded features. The DIAL lead developer scoped each feature and gave a time estimate for completion. As a group, we voted on what we thought were the best features to focus on.
Findings: Having the stakeholder scope each of the feature ideas was very insightful to help choose which features to focus on for prototyping. Although the features were grouped by category, some could have been removed because of redundancies in ideas to streamline the process.
Annotated Wireframes
Insights
Important insights were gathered from the Kano Analysis survey where four DIAL employees gave feedback on the proposed feature designs. Based on the Kano scores, the feedback quotes, and the scoped time estimations to complete each design, the following designs were chosen for wireframing.
List of features including dev time
Navigation Table of Contents- 8hr
Customizable PDF Download- 8hr
“How to” Video Guide- 2hr
Playbook Module Progress Indicators- 2hr
Templates for Content Creation- 40hr
Language Selector- 2hr
Total Time: 62 hours
I created the high fidelity wireframes in Sketch.
Navigation Table of Contents
Estimated Time: 8 hours
Playbook consumers will be able to easily navigate through the playbook using the table of contents pinned to the left side. Each bolded/underlined heading in the table of contents can be clicked and the user is navigated quickly to that section. Each heading can be expanded to show sub-headings, such as “Actors,” under the “Requirements” heading.
Annotations
Newly added Table of Contents heading
Button to expand section to show sub-headings
Customizable PDF Download
In order to access the Playbook content offline, a customizable PDF download option is in the side menu. Once the “Create PDF” button is selected, the user can check the boxes of which section they want to include based on what is relevant to their needs.
Estimated Time: 8 hours
Annotations
Clicking the “Create PDF” button will make check boxes next to sections and sub-sections appear. Clicking this button after the boxes have been checked will create a customized PDF.
An “All” option will also appear so the user can select all of the boxes at once.
“Internet can be unstable in many developing countries (and even sometimes in the US) so offline versions of everything are useful.” -DIAL employee
“How to” Video Guide
Each playbook will have accompanying how-to videos to support content within that specific playbook. In the event the video is not available due to internet issues, there would be the option of a PDF file to guide users further.
Estimated Time: 2 hours
Annotations
A video tutorial will pop up when entering the playbook.
The user can exit out of the tutorial video.
The user can watch the tutorial again at any time by clicking this icon.
Playbook Module Progress Indicators
The Module Progress Indicator allows users to see their progress and save their progress, this feature includes progress markers for users including how far they are in the modules, the ability to bookmark their spot, and showing status of the next module upon completion. The module overview would also be on the left side bar.
Estimated Time: 2 hours
Annotations
The progress bar appears at the top of the page.
The sections are numbered. The section the user is on is bolded and the circle is a different color.
The sections that haven’t been reached yet are not bolded.
Templates for Content Creation
DIAL content creators would have access to several content type templates, so content that does not have supporting graphics still could be laid out in a more engaging design.
Estimated Time: 40 hours
Annotations
A section at the top of the page will be dedicated to selecting what kind of layout the content will go in.
The template name will appear here.
A drop down menu with other options is available.
Language Selector
In the Playbook, a language selection option at the top of the page would be added. This would make it easy for users to find and change with a button and drop-down list.
Estimated Time: 2 hours
Annotation
A language drop-down menu will appear when clicked.
“I think this would be needed only for a few core languages (French and Spanish to start, maybe Portuguese)” -DIAL employee
In Conclusion
Features were designed to contribute to DIAL’s goals for the usability of Playbooks based on key insights from the stakeholder kickoff and competitive audit. These particular features were prioritized based on the feedback from the Kano survey and allotted time budget. The next steps would be for the DIAL developers to implement these features based on the wireframes and annotations they were provided.