Duration:

4 weeks out of 10 weeks of internship

My Role:

UX Designer

Responsibilities:

Wireframe, Prototype, Brainstorm, Market Research

Team:

1 Business analyst
2 Developers
1 Visual designer

My role and Team Overview

During my 10-week internship at Avanade, a global professional services company providing IT consulting and services focused on the Microsoft platform. I was a UX Design intern in the West region Avanade X team.

My primary project centered around generative AI, which spanned 5 weeks period. As the sole UX designer, I took on the responsibility of shaping the product's functionality and creating wireframes and prototypes.

I closely collaborated with a visual designer on the team who focused in the product's color schemes and stylistic elements. Additionally, I worked alongside a business analyst and two developers to ensure the successful development of the product.

Project Background
“Here’s what the demo currently looks like ” said our project lead.
The project started with the goal of enhancing user efficiency and productivity through the implementation of an AI chatbot.  It began with an existing skeletal chatbot demo, which served as the project's foundation. Our goals were to refine the user experience and maximize the potential of this tool.
Project Goals
Provide a functioning application in a test environment trained over a sample of internal documents.
Enable users to search through documents and receive relevant answers/links to documentation for the use cases around summarization and extraction of information using Azure OpenAI.
Use case Ideation workshop
To streamline our project's progress, our team held an ideation workshop. During this session, we brainstormed potential use cases for the chatbot based on the existing demo. It helped us figure out a better direction for our project.
Brainstorm
After identifying a use case, I put myself in the shoes of the target audience, the sales team. I explored the skeleton demo on my own and brainstormed some improvement ideas that aligned with our project goals. These brainstormed ideas laid the foundation for our later design solutions.
Understanding the AI Landscape
Artificial Intelligence (AI) is a rapidly emerging technology trend embedded in a variety of products and services. Since this project marked my first experience in AI design, understanding the current AI trends and patterns was crucial for the design process.
Market Research and Analysis
I began with some market research with another Visual Designer. Together, we discovered several AI products currently available to users.
Some products we explored included:
ChatGPT
BING
Midjourny
Google Bard
Gamma App
commonalities:
Chat-based interactions: answer questions, provide information, and engage in conversations with users.

Visual Feedback: visual feedback includes elements like loading animations, progress indicators, and data visualizations, which help users understand the AI's actions and responses.

User Assistance and Documentation: AI solutions often provide user assistance features, including documentation, tooltips, and help guides, to support users in making the most of the AI's capabilities.
differences:
Some have history tabs: allow users to revisit their past interactions, view previous search results, or access their conversation history.

Multi-Language Support: supports a wide range of languages, allowing users to interact with the AI in their preferred language.
Design Focus
Here are some design focuses that have been set up at the start of the process.

By incorporating these design focuses before working on solutions, we want to create a user experience that is intuitive, efficient, accessible, clear, and simple. This not only enhanced user satisfaction but also optimized the value and utility of the AI bot in helping users analyze their uploaded files.
Intuitive Design:
The interface must be easy to understand, reducing the learning curve for users.
Efficiency-Oriented Design:
Minimize user effort, making tasks quicker and simpler.
Accessibility Inclusivity:
Ensure all users, including those with disabilities, can access and use the platform.
Clarity in Decision-Making:
Present information clearly for better-informed decisions.
Simplicity and Essentialism:
Focus on core features, avoiding unnecessary complexity for a user-centered experience.
Let's introduce the user persona to identify the target audience for our design.
User Persona
Meet Jane
She is excited to roll onto her first project.

However, 15 minutes before her initial meeting, Jane realizes she forgot to read an essential attachment in preparation.

Luckily for Jane, Avanade offers a solution that can help her access the necessary information swiftly.
Design Iterations
The whole design went through multiple iterations, aiming to reach the minimum viable product before the showcase. Each iteration represented a step toward improving the user interface and functionality.
Iteration 1
In Iteration 1, the primary focus was on establishing the basic layout and structure.

The interaction between users and AI and the file upload feature, were organized into a 50% and 50% spacing arrangement.
Issues
  • Difficulty in identifying the primary user action.
  • Unclear representation of the top three selections.
  • Improve space utilization
Iteration 2
Iteration 2 built upon the feedback received from my mentors and I further refined the layout.
Changes made
  • Adjusting the split to a 70% and 30% spacing, with a focus on highlighting the user's interaction with AI.
  • Incorporating the ability to collapse the file upload section when not in use.
Issues
  • Users were uncertain about what AI could do.
  • There were some inconsistencies in the design
Iteration 4
The upload action was prioritized by placing it as the first action since users needed to upload a file before initiating a conversation with AI.
Changes made
  • Revise the action flow to start with uploading a file, followed by chatting.
  • Integrate the visual designer’s work, incorporating a new color palette and some visual elements.
  • Adjust the corner radius and improve visibility distinctions between the chat box, tags, and buttons.
Issues
  • During the design demo presentation, we identified an issue where user confusion arises from separate screens for selecting a file from the database and uploading a file.
The design team continued to iterate, addressing issues and enhancing user interactions. Finally, after multiple iterations, we reached the final version of the design.

Throughout the design process, seeking and incorporating feedback and critiques has been one of our top priorities.

I actively reached out to my team members, including full-time developers, UI designers, UX designers, and content strategists within the Avanade X team. Their feedback has been invaluable in evaluating and improving the visual, functional, and content aspects of the design solution.
Moodboard & Color Palette
In our design process, our team used a moodboard to curate our thoughts, ideas, color schemes, and moods. This moodboard serves as a visual reference and source of inspiration for the visual choices.
Our color palette consists of three primary elements:

Neutrals: Black and greys to ground the design with a sense of balance
Primary color: Blue provides a sense of trust and professionalism
Secondary color: Green is a friendly color associated with growth, positivity and forward actions
Four Flows of Platform
Our platform is structured around four primary flows:
The Solution
Flow 2
Upload/Select a File
Users able to upload a file from their desk or select a file from user database

Intuitive File Upload: We created an intuitive file upload experience, enabling users to upload files directly from their devices.

User Efficiency: Users can easily access and select files from their personal database, saving valuable time by previewing files on the same page.
Flow 3
Chat with AI
Able to interact with AI and has follow-up questions

Proactivity
: Our design provides users with options to guide the conversation.

Helpful Assistant: The AI generates results based on personal preferences, enhancing user satisfaction.

Anticipating Needs: We incorporated a feature to suggest follow-up questions based on the ongoing conversation.
Flow 4
Side Bar
The side bar offers users access to their chat history and the ability to initiate new conversations.

Easy Access: We made the side bar accessible across the entire user journey for quick information retrieval.

Quick Information Retrieval: Users can access previous output history and recall past information effortlessly.

User Privacy and Control: We provided an option for users to delete their output history, ensuring their privacy and control.
Potential Impacts
Increased Productivity
Focus on more critical tasks
Time Efficiency
Save time searching for information
If we have more time we would:
User Testing: Implementing user testing to continually improve the chatbot's performance and usability
File Deletion Option:
Offering users the ability to delete their files stored in the database, enhancing control over their data.
Physical Annotations:
Providing physical annotations on an uploaded document so the user has another way they can interact with their document
Database Backend:
Storing user account information, uploaded files, and previous chat histories for easy re-access and reference.
Things I Learned During the Project
One significant takeaway from this project is the importance of collaboration and communication. Working with people in different specialties in the process, maintaining transparency in my work, and providing progress updates to the project lead, stakeholders, and team members are crucial for our MVP deliverables.

Another lesson learned is the necessity to prioritize the most important tasks. When facing time constraints, I've come to realize that we may not always be able to fulfill all our ambitious goals. Therefore, focusing on feasible functions and features within the limited time is essential.