cloudDesk case study

cloudDesk is a cloud storage service that caters to teachers, students, and other professionals working in the educational field.

View Prototype

my roles

UX Design

Visual Design

Brand & Identity

deliverables

tools used

Figma

InVision

Usability Hub

challenge

Lesson plans, projects, new academic standards—the modern educator has an ever increasing workload and it can be easy to feel overwhelmed and disorganized. Working together with colleagues provides enormous benefits for both students and teachers but finding the time to do so is often challenging. Today’s educators need an easy way to stay organized and to collaborate with their colleagues in order to support their students’ academic success.

solution

cloudDesk offers a familiar yet unique cloud storage experience where users can upload, create, and organize content. Perfect for busy educators or students, users can quickly and easily find files based on file type or via a convenient search bar. Where cloudDesk really excels however is in collaboration—beyond sharing files and folders, cloudDesk users can also chat directly with their teammates from within the site as well as work together on a collaborative to-do list. Everything's better together!

process

user research highlights

The results of my user survey confirmed that users do want to save, organize, and collaborate on content within the cloud. I learned that many users are concerned about the security of their data in the cloud and they have several ideas for enhancing collaboration, including the ability to chat and to work on a collaborative to do list.

43%

45% of respondents worked in the education field in some capacity.

88%

88% of respondents identified organization as their favorite feature of their cloud storage service.

53%

53% of respondents said they use the collaborative features of their cloud storage service either every day or a few times a week.

competitive analysis

I conducted a competitive analysis of Google Drive, Dropbox, and Pinterest—the three most used cloud storage services among my survey respondents. After mapping out onboarding, organizing, and saving content user flows for each of these competitors, I determined that Google Drive and Dropbox had simpler flows than Pinterest. Given this I decided to leverage aspects of these flows in my own designs.

user personas

With the data from the user survey I constructed two user personas for this project. Mathew P. wants organizing his files in the cloud to be easier and is worried about data privacy. Luisa R. is interested in the collaborative capabilities of the cloud in order to boost her own and her team’s productivity.

information architecture

wireframes

I designed the wireframes for this app based largely on Google Drive in order to keep the feel of the app familiar and easily understood by my users.

I put my wireframes in front of several potential users to test my initial designs and gain needed insights on my user flows.

visual design

branding

Given my survey results I decided to focus on the education field as our target market. With this in mind I felt that the brand should evoke the feeling of an encouraging and supportive classroom: someplace bright, happy, and sunny, yet relaxed and calm. With these emotions in mind I created a moodboard from which I pulled out the primary and secondary brand colors: a cool blue and a warm yellow.

HEX: #49B1CC

R: 73

G: 177

B: 204

HEX: #1E425E

R: 255

G: 216

B: 118

logo design

With the education field as my target market, I began sketching logo ideas that included images relating to clouds or to school. After some informal user testing, I landed on a simple drawing of a school desk within a circle. The desk is immediately recognizable to users and has a friendly, playful feel that coincides well with the overall brand approach. I chose the name cloudDesk in order to reference both our target market as well as clue users into what our product does.

hi-fi mock ups and preference testing

With the previous usability test results and a style guide in hand I set about putting together high fidelity mockups of the cloudDesk site. In order to refine my designs I did a few rounds of preference testing.

Originally I placed the cloudDesk logo at the top of the homepage. However after conducting some A/B testing, 62% of respondents preferred to have the logo in the top left corner of the screen.

I had also originally designed the dashboard’s side menu with large icons next to each of the menu options. When given a choice between that design or one with much smaller icons, 67% of respondents preferred the smaller icons.

I had originally designed the login window to drop down right below the “Log In” button when clicked. Given the choice between that design or one that included a white carrot arrow pointing downward from the “Log In” button, 67% of respondents preferred this second design. Given these results, I made the appropriate changes to the design of these three elements.

final usability testing

When I put my designs in front of potential users for usability testing, they all praised the overall look of the cloudDesk app. Test participants stated that they felt “calm” due to the color choices and, because the app looked familiar, the app felt “very user friendly,” clean, and uncluttered.

Some suggestions participants made in order to improve my designs focused on the New Document screen. They suggested:

Including a back button, in order to navigate back to the dashboard from a document screen
Decreasing the size of the profile icon to de-emphasize it and,
To change “New Document” to “Document Title” to make it clear that that input field is editable

conclusion

what worked?

The branding I designed for cloudDesk was quite successful. During usability testing participants responded positively to the branding and often expressed feeling the brand emotions that I was trying to communicate via my design choices. Users during testing stated that the color choices made them feel “calm” and that the use of circle shapes (on the landing page) had a playful feel.

what didn’t work?

A major challenge I faced while working on this project was including unique functionality focused on the identified target market. I included two collaborative features to address this and to set cloudDesk apart from its competition: a collaborative to-do list and a chat feature. While I do think these features would be of use to teachers and students, I still think more could be done with this project to clearly establish the education field as its target market.

key takeaways

This project underscored for me the vital importance of user research throughout the design process. Whenever I felt stuck or unsure of how to proceed, a round of preference or usability tests would immediately shed some light and point me in the right direction. Moving forward I hope to conduct even more user research in future projects in order to create truly human-centered designs.