SUMMARY
User Experience Design & Branding
Folio seeks to create a cloud storage solution so easy to use that
instructors and students will never want to return to hard drive
storage. Folio needed an identity with a modern, user friendly
appearance. These goals guided the design decisions throughout the project.
Stay organized
at school, home, or anywhere
in between.
Stay organized
at school, home, or
anywhere in between.
Folio seeks to create a cloud storage solution so easy to use that instructors and students will never want to return to hard drive storage. Folio needed an identity with a modern, user friendly appearance. These goals guided the design decisions throughout the project.
-
A saturated market of cloud-based
storage applications. -
Didn’t know what features were
most important to our specific user base. -
Teachers and students have a lot of
documents to create and organize.
Keeping it all in one place can be
cumbersome.
SOLUTION & PROTOTYPE
-
A saturated market of cloud-based storage
applications. -
Didn’t know what features were most important to
our specific user base. -
Teachers and students have a lot of documents
to create and organize. Keeping it all in one
place can be cumbersome.
PROBLEM
-
Identified the education market as a niche and created a unique identity and brand full of energy with modern flare.
-
Through user research identified file upload, content creation, and content sharing were most important to users.
-
Focused on a easy to use interface that allow teachers and students to easily navigate the application and manage files.
BRANDING
Logo & Design
Sketches helped establish the overall look of the logo
design. Sharp edges and clean lines gave us the clear
and structured appearance necessary to fit the brand.
Sketches helped establish the overall look
of the logo design. Sharp edges and clean
lines gave us the clear and structured
appearance necessary to fit the brand.
Color Palette
The colors used create a sense of energy and
productivity. A style guide was created as
part of the branding process.
#65EEB7
#F4F4F4
#FF5722
#0F3645
RESEARCH
Goal of the Research
It was important to find the right combination of features to meet the needs of teachers and students.
71%
FILE UPLOAD
57%
CONTENT CREATION
71%
CONTENT SHARING
Surveys
Our research identified the most important features:
71% thought file upload was important. 57% felt content creation was essential. 71% highly valued content sharing.
Personas
BIO
Emily Hall, 25
Graduate Student, Photographer, Artist
Bloomingdale, IN
GOALS
- Upload Files
- Organize photos for school
- Share photos
- Create content for class
- Access files from any device
“Being able to organize and share
files with teachers, friends, and clients
motivates me to use cloud storage.”
Users personas were created to learn more
about our users and ask questions that might
begin to identify why users value certain features.
BIO
Sebastian Mateo, 32
Sales Manager, Dad, Biking Enthusiast
Sacramento, CA
GOALS
- Access files from anywhere
- Upload documents
- Create documents
- Share work with colleagues
- Platform that’s easy to use
“Staying organized and keeping
files in one place is important to me.
I also have to be able to access
documents from anywhere.”
USER FLOWS
The Design
User flows were created as a way to map out the design of the application by identifying screens the user will encounter for each primary feature.
WIREFRAMES
The Design
Wireframes were roughly sketched to begin the
design process. Screens such as the dash and the
add files pages underwent many iterations before
and after testing.
Wireframes were roughly sketched to
begin the design process. Screens such
as the dash and the add files pages
underwent many iterations before
and after testing.
USER TESTING
The Design
Each feature was tested through low fidelity and
high fidelity mockups. Changes were made to the homepage to include more information about the product. Changes were also made to the dash as
the navigation items were clarified.
Each feature was tested through low
fidelity and high fidelity mockups.
Changes were made to the homepage
to include more information about the
product. Changes were also made to the
dash as the navigation items were clarified.
The original design of the Drag and Drop screen was problematic because users could not see files
unless they scrolled to the bottom of the page. Users wanted to be able to see what already
existed in the Folder & Files storage space so they
could better organize files.
The height of the drag and drop box was adjusted
in the HiFi mock up so users could easily locate files within their account. New buttons were added so teachers and students could create a new document or add a new folder from the Files and Folders page. Additional features were also made accessible from the top navigation menu.
The original design of the Drag and Drop screen was problematic because users could not see files unless they scrolled to the bottom of the page. Users wanted to be able to see what already existed in the Folder & Files storage space so they
could better organize files.
The height of the drag and drop box
was adjusted in the HiFi mock up so
users could easily locate files within
their account. New buttons were added
so teachers and students could create a
new document or add a new folder from
the Files and Folders page. Additional
features were also made accessible from
the top navigation menu.
Low & Hi Fidelity Wireframes
PREFERENCE TESTING
Usability Hub was utilized to preference test several broad and specific features. Based on user preference, the test lead to color changes that fit the brand and increased readability.
Conclusion
When we began this project we didn’t have clear idea of what features users really cared about having in the application. Through our surveys we were able to identify exactly what mattered most. Many iterations of wireframes and testing help us to understand the importance of the test conducted as positive changes and improvements continued throughout the project. From the homepage, to overall navigation, color and layout changes led to revisions imperative to an easy to use application. I learned that when in doubt, test it!