My name is Alejandro Garzon. I'm 22 and currently a fourth-year Human-Centered Computing student @ RIT. Born and raised for half of my life in the tropical city of Santa Marta, Colombia, I moved to the United States about 10 years ago. I have a passion for technology, especially when it comes to human computer interaction.
I started as a Computing Exploration student, which allowed me to get a taste of each field before committing. By the end of Freshman year, I had declared as an IT student. As I immersed myself within the field, I found myself being drawn towards topics of design and user interaction. By the beginning of my Sophomore year, I had heard about a new major called “Human-Centered Computing”. I instantly switched, and fell in love with it. Up to now, it has been the best decision I have made during my college career.
Group project where team researched and developed concepts for a note-taking application, and designed its interactive prototype.Read More...
We wanted to focus our mobile app towards helping those who were involved in an academic environment by targeting an area where the majority of users could benefit from. That is when I suggested the idea of a tool that could aid students when it came to note-taking. Everyone within the group admitted that at some point they had struggled to take notes and pay attention to the material at the same time, which is when we decided to focus on a note-taking application. We wanted our design to be simplistic, and quick and easy to use so those who wanted to pay attention to the material could press one button and let the app take care of the rest.
The purpose of SNAPnote was to facilitate users who struggled to take notes, which made us want to follow a quick and easy to use layout; a user selects a note taking method and presses a button and the app does its job. But how exactly DOES it do its job? We came up with two main concepts for how our app would take notes: Audio and Camera Mode.
The “Audio Mode” would allow users to press the record button and let the app listen, and translate the input into text document. The “Camera Mode” on the other hand, would allow users to aim their cameras towards already written content, and the app would recognize and translate the content into a text document. Once the two main features were decided, we conducted research in order to better understand the user’s needs, and to see if perhaps users wanted more, or less customization freedom. Multiple surveys were sent out regarding how often users take notes, or how organized they keep them. Once data was collected and analyzed, we discovered that the majority of users struggled to keep their notes organized, so we added multiple features that organized notes by categories such as course subject, name, date created, etc.
We then created a functional prototype, and gave it to several users to try. In order to understand the flow and navigation of the application, we told users they had the freedom to do whatever they wished, and asked them to not ask for help if lost. In the end, every user was able to easily navigate and accomplish what they wished to do, which let us know that we were ready to use this as our main design layout.
Analyzed magazine and news sites for their strengths and weaknesses in terms of design layout and UX, and applied them towards redesigning RIT's REPORTER site.Read More...
The Reporter is a student based site that focuses on sharing articles revolving around campus life/interests. Although it has a rather simple and user friendly navigation, its simplistic design makes the site and content visually unappealing, which was a focal point when the site was originally a magazine. With a design layout focused on visual stimulation, users will likely find the site’s content more appealing and engaging.
In order to close the gap that seemed to be missing between the Reporter’s previous state (magazine), and its current state (website), I created a layout with a lot more emphasis on visual demographics. For the home page, instead of having a larger navigation section with two bars at the top, I added multiple featured articles with appealing images that will act as the site’s banner. The content area has also been revamped: the Twitter section has been removed, and has been replaced and expanded as a section for the top story/article. The most recent articles will be displayed in a similar manner, but will have an emphasis on its images and typography. Following the same theme, article, and other content pages will still have a large emphasis on visual elements (large images, bold fonts, etc.).
A second site layout was also created. I wanted this design to focus more on the site’s articles and the writer’s content, which led to a design that utilized its space to display more articles. Although more content could be displayed, it was visually unappealing and lackluster compared to the first design.
Due to how the site is managed by both faculty and students, I looked at their "about" section to get a better understanding of the project stakeholders, and listed those who I thought would be crucial. Also, In order to get a better understanding of what needed to be designed, I thought about your "typical" user within the site. This provided a sense of direction in a quicker manner without having to develop multiple user personas.
User stories were created in order to help pinpoint certain features that could potentially be useful for users. Although not every single feature was planned to be added, it still provided aid in terms of visualizing what the layout would eventually be.
Creating a completely new design while also trying to preserve some of the
aesthetics that make the Reporter THE Reporter was challenging. Although
I had a about 10 different concepts in terms of site organization and
hierarchy, choosing the actual visual elements was difficult.
I had three potential designs in mind for what the site should look like.
I created multiple moodboards to try to achieve some of visions I had, and
eventually ended up with a dark and bold design with a paper-like style.
This would allow for the images and other small color accents to really
stand out and do the majority of the talking, which is what I had originally
intended to do.
Designed new “Meet the Team” concept for Twisted-Rope's interactive site that would encourage users to navigate through the site rather than just simply reading from a list.Read More...
Twisted-Rope's interactive site is currently a source for both users and clients to get a sense of what the company's main office is like. Site visitors can navigate through the site and look around and get additional information from clickable hotspots. Within the site, users can also learn specific information about each employee and their role within the company. However, this piece is currently tucked away in a side menu, and once opened, it does not provide any interaction whatsoever, which completely defeats the purpose of an interactive site.
Due to the site's main purpose being the interactive
elements, I wanted to come up with a concept that
would encourage users to explore within the site
whenever they wanted to get information about the
company's employees. I analyzed the site's current
layout and discovered that they had member
silhouettes scattered across the site. That is when
I came up with the idea of a design that would
incorporate these silhouettes within the “Meet the Team”
piece. Since the majority of the content was already there,
I used Principle in order to prototype the exact
motions I had in mind for its interactive pieces.
The main concept within this design is that each member would essentially become a clicakble hotspot. Whenever a member is clicked, the area of the office would zoom in to its location while the silhouette expands in an outwards manner. At the same time, a window would appear next to them containing their information. This animation concept was inspired by ones used similarly in video games and comic movies whenever characters are introduced.
An important element that was needed to be considered was the integration the list of the other team members. After all, it's meet THE team piece, not meet SOME of the team. In order to achieve this, I added a menu that contained a list of all the team members of the company, and linked it through a clickable link that would be present in all of the member's individual descriptions.
From the member list, users would be able to browse through all the members, and click on their portraits. Once clicked, the site would be pan out to the location of where their silhouette is located, and would prompt the same animation along with their description.
Due to how the site would be unable to fit 40+ member at all times, only a certain amount would be randomly displayed for certain periods of time. And, if a member is clicked within the list of team members that is not currently present within the site, the previous silhouette would be replaced with the one that was clicked.
Redesigned layout and branding for the landing page of a videogame livestreaming website through user and market research.Read More...
Twitch is a livestreaming website where users can broadcast themselves playing videogames. With more than 2 million monthly broadcasters, the site offers a variety of games and entertainers for users to enjoy. However, due the amount of content being displayed at once (especially on the landing page), users are bombarded with an overwhelming amount of information. From bright and colorful videogame covers, to blocks of texts and descriptions, navigating through the site, especially for the first time, can be a challenge, and can quickly make users miss the main points of the website.
Since Twitch is a website that revolves around gaming, the focal point SHOULD be videogames. Although the site had already dedicated graphics such as game covers, posters, etc, it does a poor job at making them the focal point. With blocks of text such as streamer descriptions, game titles, and viewer stats, everything becomes unpleasing to look at. By aiming towards a more minimalistic design, users would have less information to process at once.
In order visualize the direction of the site's redesign, it was crucial to understand how multiple different users would benefit once they arrived at the landing page. And although the large majority of users would be teenagers/young adults, each would have different gaming backgrounds and motivations.
Prior to the full redesign, I focused on three specific elements that defined Twitch's landing page; featured streamers, top videogames, and top livestreamers. The composition of these three elements were the deciding factors that "make it or break it" when it comes to making first impressions, aswell as allowing its active users to quickly finding good content while exploring.
Once the main three visual elements had been defined, the rest could now be built around them. In order to avoid making the content dense and overwhelming again, I used a black and white color palette. This give the website a more cinematic feel, and allowed for the crisp and bright colors of the video game streams and covers to really stand out and be the main source of attention. The large use of text was removed, and only a minimal amount remained. This created a more scannable layout that allowed for new users to find the most relevant content for both top videogames and streamers extremely quickly. And, as for current users, they would be able to browse for new content just like new users, but also recognize top streamer names that they may have heard of in the past.