Whiteboard

Whiteboard is a product concept for a team project development web app. Organization capabilties consist of an alternative use of kanban boards. With a slight remix of these boards and the implementation of "unitary editing blocks." Along with all of these features, Whiteboard establishes a foundation for collaboration.

whiteboard banner

Intentions

“How can we help teams work together on the same page?"

Vision

Lower Barriers Between Team Members

Giving team members an avenue to lower their barriers against each other will help unite a team's vision to accomplish goals together. Essentially, teams should feel empowered when on everyone is on the same page. 

Organize Project Agendas

Uniting teams through a web-app focused on simplified documentation and file management can clarify tasks, goals, and agendas. 

Freedom of Collaboration

The feeling of liberation that comes from the freedom to collaborate, chat, edit, and monitor projects is one step toward teams enjoying success and productivity.

Goals

1. Optimize for flexible creation, editing, and collaboration.
2. Create and interaction that makes it easy to communicate and establish a team environment.
3. Help teams answer:
       - How can we bring all of our members onto the same page?
       - How can we make collaboration feel easy? 

Measuring Success

From a user experience perspective, I designed Whiteboard as a personal exploration project. It was a means for me to explore ways to approach a product focused on teams and their productivity. Because I centered the approach and design around project collaboration, chat, and team building, I concentrated on user happiness and repeated task success.

       - Can the user customize their project organization?
       - Can the user add collaborators to their project?
       - Can the user navigate chats?
       - Can the user locate mutual projects?
       - Can the user create their own teams?

With Whiteboard’s current status a concept exploration, my personal goal was to establish a refined design and create a basic interactive prototype that can be tested for task success.

Building the Foundation

Diagram

Learning the Layers of Interaction

Understanding the basic structure, objectives, features, and relationships helped me get a better perspective on the interactions that a team would need in order to not only feel productive, but also work together on the same page.

Being able to see "eye-to-eye" is important, and I constructed Whiteboard's flow to integrate project organization, team management, and chat communication through focusing on the "Shared Projects" feature to encourage users to create more projects or stir more communication. 

Sketches

Having a collection of sketches helped me net out broad ideas into more specific detailed designs that I could implement into the rest of the case study. Through sketching, I tried to focus on what could seamlessly intertwine the user's experience of creating, sharing, inviting, and managing.

sketches
My_boards_1

Boards

I decided to use the term, "board" to refer to projects. Boards are then divvied between personal, shared, team, and favorited boards. It prompts the user to identify their boards with the intent of organizing their projects according to their needs. 

If we consider project management as an exercise in promoting personal and team organization, the Boards menu sets up the user to identify what their preferences are and how they can customize their workflow to meet them.

boards extra
Team Page

Teams

At the core of Whiteboard is a team and project management interface. The ability to create and manage teams is crucial for users to configure existing leads, members, shared boards, and chats. The Teams page encourages users to monitor team activity across projects and chats. 

teams extra
Chat Page

Chats

Given that the Chats page focuses on communication, the Chats page ensures that users can also view shared boards. Users can view existing chats, the current chat, and shared boards between the user and chat members.

With the sentiment of bringing users and team members together to be "on the same page," the Chats encourage users to come together.

Sample Board Development Flow

Process2

Reflect

After having experimented and explored this design concept, I learned the importance of maintaining a consistent goal throughout the process. It was easy to focus on different branches and features of the product, and lose focus on the overarching intention and goal of the project. With a project concept like Whiteboard, it was important for me to always ask, "how can I make a team feel united and productive?" Overall, I really enjoyed the thought process and experimenting different designs for a concept that is geared towards team development and project management. 

View the Latest Prototype

Takeaways

1. A "pretty picture" will never make up for an elegant experience.

2. Understand everyone's goals. It's hard to stay on a track without asking yourself important questions that pertain to not only user's happiness, but also the user's objectives/needs.

3. Sketch, sketch, sketch. Ideating through different options will help with making decisions with strong convictions.

Thank you for reading!