VSorts AI

Project summary

The different levels of VSorts™ AI

VSorts AI UI Library

The VSorts AI design library was curated over a number of months using Figma's componentization capabilities and auto layout functions. A point was made to keep development consistent with desgin during the engineering process. With a combination of UI kits, the devs and I were able to come to a middle ground in terms of design due to time and personnel constraints.

The UI library is constantly being updated and added to while features get reworked user experience and user interface.

Out with the old

This image shows what the original designs looked like when I joined the company. While they were functional and technically moved users from point A to point B, they fell short of being truly intuitive or easy to use.

At the beginning, there were only two activities where users could enter input. Over time, the company expanded to four different activity types for interacting with and collecting data across the platform. In addition, two entirely new CRM-style use cases were introduced, along with a standalone product concept. This evolution took a little over 14 months to put in place. During this time, several analytical tools were also added, along with new data values that are now visible across the platform.

In with the new

The first changes focused on the dashboard. While these updates were relatively simple to design and implement, a key challenge emerged around the clusters area. The MVP version was intentionally minimal, but future features were more complex and required additional space, which was accounted for from the outset. Different user types also had to be considered throughout the design process.

Onboarding

An onboarding was never implemented before I was brought on. This was a major red flag for me so I worked alongside the CTO and CEO to get this implemented asap. The onboarding allowed us to collect demographic data that could be used to analyze and filter through any data that is collection but any of the activities listed in the chunks below. It also allowed to have a more cohesive experience when onboarding new user to make them feel like they are stepping into a more professional platform, not a start up. Considering the platform is not mobile friendly; screens were created and implemented to let users know to switch devices before they are able to proceed from a mobile device.

Admin

The admin space is where a user can create all of their data collection material, view data, and score data. A difficulty was managing the permissions for each person and place. Making multiple user types with a permission drive system became the solution, but this required multiple variations of the UI.

Cluster Deployment System (CDS)

The admin space included a proprietary system called clusters in which you could curate set activities or experiences and deploy them to a number of groups, contexts, and more. This would allow all the data to be kept within their own context and source. Clusters also gave the ability to constantly reuse the same form or activity without the need to recreate it multiple times for multiple contexts.

VSets (Vignette Sets)

VSets are an activity type for collecting data in a more gamified way. These are generally referred to as Q sorts in the world of qualitative analysis. The largest issue I faced with the original design was the drag and drop portion. Many of the vignettes that are put into the activities can be extremely long in length which made it difficult the have a few that fits into one space or screen. This was solved be rotating the entire UI 90 degrees in order to have a top down view for the drag and drop portion. The vignettes were also made collapsable to account for longer text all while keeping the entire activity within view.

VSets as an activity get more complex the deeper you go with the "parking lot", "unpacking", and AI analysis and interaction to complete the Q sort in its entirety. The parking lot is a standalone, but I was able to keep a consistent UI for the unpacking by reusing the forms UI which is next.

Forms

The forms were designed to be similar to google forms while incorporating AI and other features such as scoring and data analysis metrics. The forms were easy to design, but creating a view encasing all of the collected data was quite the mission that was completed over a very short period of time. The MVP started as a simple view where it showed each question and answer by user. In order to meet further needs and requirements, it gained a summary analysis displaying averages and other metrics, as well as the ability to view in multiple contexts (by user and by question). These designs were done in 1 week with 4 weeks left for development before a major conference in Denver, CO (AERA).

ChatBots

VSorts AI ChatBots are like a prompted version of chatGPT and are 1 of 2 deployable data collection tools (The other being clusters). They run off of proprietary copilot engines that are specific to the data on the platform. The pain point I had here was similar to the forms. We had 1 week of design and 4 weeks of development, but everything was able to be done in such a short amount of time. The ChatBot UI has multiple variations over the past 2 years, but it has finally reach a more modern point where it has a plethora of new features for the user, and a full screen UI. A point was made during the creation process of a chatbot to make sure that validation was in place to avoid deploying an empty activity.

User Management

The user management system was a monster lift. The team and I had to account for over 10 user types across 3 contexts with multiple different levels of access. I reused moved of the UI that was previously utilized by the admin dashboard to create an ease on development. The design process included a multitude of meetings to figure out an implementation process during all iterations of the design. This was due to personnel and technological constraints with the platform itself.

Creation and management

Creating a UI that could handle seamless user management with groups in the 10s of thousands was easier than expected (not for developers). In the end, the group creation process was a way for users to control their context when deploying activities or other content for people to see and/or interact with. The UI also allowed for a drill down structure where you could have a spiderweb of groups and sub groups to control the flow of data and activity creation.

VSorts Marketing Site

I was put in charge of not only building the marketing site UI, but as building the physical site within Wix. This process took about 1.5 weeks in total to design and develop in conjunction with one another. The live site can be seen at vsorts.ai

Culturally Responsive Solutions Marketing site (CRS) (Shutdown)

CRS was our original parent company, but was later shelved due to issues stemming from the current government at the time. I handled the design for the landing page from top to bottom. The origional site can be seen on the very left of the image.

Project management and integrations

I was placed in charge of the project management role due to my level of understanding of the platform. I managed the entire engineering team through a jira board, dev stand ups, push dates, and more.

I was also in charge of monitoring Sentry on the back end and doing customer discovery/satisfaction by reporting on bug tickets and other issues that came through that communication channel.

I was also in charge of the set up of and design for the marketing email templates that were being created and sent via Send Grid.