top of page
San Francisco Fleet Week Mobile App
Full Time App Developer and Designer
at San Francisco Fleet Week Association
Lets you search schedules, tickets, and discounts instantly and conveniently.
OVERVIEW
Problem
| 2022 Intern - App Developer and Designer
In order to implement the app, I found out the current problems by identifying issues from a user experience perspective. For example, I conducted an app critique for the 2021 version and identified areas for improvement, such as visual inconsistencies, confusing hierarchy, and issues with user flow. Moreover, I conducted user tests for three main user flows and found that unrelated and redundant categories and information made it difficult for users to find what they needed.
| 2023 Full time - App Developer and Designer
In 2023, I became a full-time app developer and designer. I found several areas that could be improved after I completed my internship, including design inconsistencies between the web and app, different styles of icons, and system restrictions in the app developer tools.
Solution
Then, based on the problems I found, I documented those problems and proposed solutions.
| 2022 Intern - App Developer and Designer
After conducting user tests and analyzing the object-oriented design, I found that there are unrelated and redundant categories, making it hard for users to find information. To address this, I created a sitemap to understand the structure clearly. I then restructured and redesigned all pages, improving visuals, adjusting layout, and optimizing font size for better readability.
| 2023 Full time - App Developer and Designer
I primarily restructure information architecture to ensure consistency in web and app design. Additionally, I redesign visual elements, including iconography, typography, color palette, and background images, to enhance visual appeal and maintain design consistency.
My Role
App developer & designer
Timeline
July - Current (Part Time),
Jun - Oct 2022 (Intern)
Team
Lewis / Executive Director
Diana / Chief of Staff
Michael /Senior Engineer
Tre / Concert Series Coordinator
Barbara / Volunteer Coordinator
Others
Type
UX/UI Designer, App Design,
App Development
Tools
Figma, App Machine, Photoshop, Illustration,Excel, Microsoft Teams
| Our Approach
| My Contribution
Redesign the mobile app
Creating an visual appealing design
Updating up-to-date information
Weekly team sync meeting
Creating user interface using front-end programming
Solving the app ambiguity
Deploy and manage the app
User test
DESIGN
| App Critique
-
Monotonous Page Style
-
Inconsistent Iconography
-
Over-length Title
-
Redundant Categories
-
Low Color Contrast
-
Small Font Size Challenges Readability
-
Inconsistent Design Details
-
Unobvious Button
-
Incorrect Content Information
-
Confusing Visual Hierarchy
-
Small-Font Size
-
Outdated Gray Color Scheme
| User Testing - Three Main User Flows
-
Difficulty finding military discount information
Tester spent almost 7 minutes searching for information about restaurant military discounts
Task Flow 1 (Discounts)
Task Flow 2 (Events)
Task Flow 3 (Volunteers)
| Object-Oriented Design
-
Unrelated and redundant categories and information
| Updating and Organizing Up-To-Date Information
| Increase Accessibility - Content
-
Increase font size
- Heading 18px regular → 18px bold
- Title 12px bold → 14px bold
- Paragraph 12px regular → 14px regular -
Align left
Make users easier to read and scan. -
Highlight CTA button
Make it stand out by highlighting it with different color or by making it bold. -
Increase the line height
Improve readability and make users easier to read.
| Ensure The Design Consistency Of The Web And App Versions
| Redesign Visual Components
| Iconography
| Typography
| Color Palette
| Front-End Programming
-
HTML, CSS, JavaScript
-
Translate my design into code
| Comparison 2021 / 2022 /2023
WHAT I LEARNED
OUR TEAM
FEEDBACKS
.png)
bottom of page