portfolio.
bring architect into digital.
How do we travel in physical space? Architects and interior designers have spent centuries exploring and understanding people's navigation within physical space. The spatial planning theory is a way to manipulate the spatial characteristic, circulation, and context through different configurations of adjacent spaces. This theory was created because we understand that physical space needs to be coordinated by the type of activity that happens inside. and there is no difference with mental activity, each type of information has a different mental processing structure. But the browser today reduced them into one simple click and open interaction.
spatial planning theories.
Thus, I was inspired by this idea. In Architecture, the spatial organization has five fundamental structures: Grid, Radial, Centralized, Cluster, and Linear. Each of them is used in a different function to maximize the usability of the space
ideation.
I quickly put together simple user interaction for the spaceFlow browser. The possible way to switch between tabs.
Feature 01 - Stay organized.
Early in my research, I interviewed a couple of students about their workflow of gathering information online, and all of them described their process varies based on the browsing subject/topics. Later, I was inspired by the spatial organization theory in Architecture that form follows functions. The organization's style varies by different types of browsing activities. spaceFlow generates a relation graph on the right side of the page to show the relationship between websites and search terms.
metadata.
The browser uses metadata to help generate structure and sorts open tabs. Based on your searched subjects and keywords from web pages. SpaceFlow can choose one of five organization styles to organize your web pages.
Feature 2 - easy access
User can save tab groups and upload to clound. No more leaving tabs open for weeks. Quickly switch between different projects and access them on different devices with accounts.
Feature 3 - custimization & more.
spaceFlow support various type of files, such as Pages, Microsoft docs, Notion, coding editor, and more, resize to fit them on the desktop for multitasking.
annotation.
Annotation and smart
note-taking by just highlighting desired paragraphs.
reflection & evaluation.
Overall, the redesign of the browser was visually aesthetic and easy to navigate. The new approach to how we think about the browsing experience was successful. Using a physical approach to a digital world was intuitive and creative. However, due to the pandemic situation, I wasn't able to conduct more observational research. The sample size for the survey wasn't enough to conclude user behaviors. It is important to see how people use their browsers, to improve the design, usability testing is essential for this project.
Lastly, the user learning curve needs to be considered further in the design. Introducing a new browser system requires the user to take time and learn.
I appreciate the opportunity to practice my current skill set and challenge myself to rethink browsing experiences.
wireframes.
Proposed Concept
02
Information Architecture
03
Design
04
why redesign.
Different types of information generate different ways of thinking, sometimes we use a structured thinking pattern such as casual relationships to find answers, but other times we only need browsing to get inspired. yet we have the same system for today's browsing experience even we have a complex and complicated mental process.
01
Understanding
research.
There are two parts of the research for this project. The initial research is to understand the current most popular browser, such as Chrome, and analyze current user flow and user struggles. The second part is researching how we process information through an in-depth cognitive perspective.
what do users say?
Interviews
To understand how and what type of information they browsing online. I conducted 2 in-depth interviews. Luckily, I was able to interview students through Zoom and record how they use their current browsers.
browsing behavior patterns.
survey
After the interview. I conducted 10 people survey to understand a general browsing habitat. Such as how many tabs they usually open, how long do they leave them open, how do they save favorite websites, how often do they go back, how do they categorize their tabs, etc. I was able to discover that most people having issues with the saving and recalling tabs process are overwhelmed by the number of tabs when doing research or any heavy browsing activity, and lastly takes them a lot of time to sort out websites.
persona developmet.
After the initial research. I went back to the current application and create the user persona. Gathered common pain points that find from both in-depth interviews and app reviews.
.png)
how to increase efficiency?
In the article “how to build a better web browser”, Berkun mentioned what people generally do on the internet. He categorized into three behaviors, Reading/Skimming, Navigation, and interaction. In these three categories, navigation and interaction are the most time-consuming behavior. Constantly interacting with the browser, adding/managing bookmarks, finding tabs, and switching between windows and software. From a cognitive perspective, to increase any productivity of learning, it’s important to decrease the time of refocusing after being distracted. Thus eliminating or reducing these interactions would increase the efficiency of browsing.
Below are three behavior patterns common in people's browsing experiences.
-
People have repetitive behaviors while browsing.
-
Category there tabs for different use.
-
Leave tabs open for weeks.