Application Design 2
September 26, 2025
Application Design 2: Task 1: App Design 1 Self-Evaluation and Reflection
FANG YAOYUE (0372006)
Application Design | Bachelor of Design in Creative Media | Taylor's University
List
LECTURES
INSTRUCTIONS
FEEDBACK
REFLECTION
LECTURES
Task 1: Self-Evaluation & Reflection
During the design phase, I will conduct more thorough user research and prototype testing, and establish unified design specifications (including fonts, colors, component styles, etc.) in the high-fidelity stage to ensure overall consistency and professionalism.For instance, there were still issues of complexity and redundancy in the information hierarchy and navigation structure on some pages, and users might need to click multiple times to reach the target page while browsing.In the high-fidelity design project of the Universal Studios theme App, I gained a lot of practical experience during the design process and also identified some areas that needed improvement. The overall goal of this project is to provide visitors with a convenient, enjoyable and immersive park experience, and to enhance the brand image and user service efficiency of Universal Studios through digital design.
At the initial stage of design, I mainly focused on the aesthetic appearance of the interface and the creation of the thematic atmosphere. Additionally, although I incorporated the brand elements of Universal Studios (such as blue and gold color scheme, movie elements, etc.) in the visuals, the color contrast in some parts of the actual interface was too low, resulting in slightly insufficient readability of the text.
However, during the later review, I realized that the considerations fAdditionally, the details of the interactive feedback also need to be improved.or user experience and functional logic were not comprehensive enough. For instance, the click status of the buttons, loading animations, and operation prompts are relatively few. Users may not be able to clearly determine whether For instance, there were still issues of complexity and redundancy in the information hierarchy and navigation structure on some pages, and users might need to click multiple times to reach the target page while browsing. their operations are successful when using it. In the future, I will pay more attention to the interaction experience and the logicality of the information architecture. Additionally, although I incorporated the brand elements of Universal Studios (such as blue and gold color scheme, movie elements, etc.) in the visuals, the color contrast in some parts of the actual interface was too low, resulting in slightly insufficient readability of the text.
During the design process, I will conduct more thorough user research and prototype testing, and establish unified design specifications (including fonts, colors, component styles, etc.) in the high-fidelity stage to ensure overall consistency and professionalism.
Through this project, I have come to realize that excellent interface design not only lies in the visual effect, but also in user experience, logical clarity and brand consistency. In the future, I will continue to enhance my abilities in user research, interaction details and usability testing, so that the design can be closer to the real usage scenarios and user needs.
Through this reflection, I became consciously aware of several issues.
1 The button / the operation area that can be clicked is too small.
Fig 1.4 The original button
Universal Studios Software: Self-Reflection and Evaluation
Introduction：
The application I designed is the Universal Studios software. Its main purpose is to provide a comprehensive travel experience and service platform for visitors of Universal Studios, helping users conveniently plan their itinerary, purchase tickets, queue up, navigate and obtain entertainment information both inside and outside the park.
I have divided this page into five main sections: the home page, the map, ticket purchase, the store, and the personal page. The main functions include providing convenient ticket and reservation services, real-time parking information and map navigation, discount and membership systems, travel guides, and tourist photo services.
This software is mainly targeted at a wide range of users, all of whom are visitors of Universal Studios. The visitors include parents with children, young users and student groups, international tourists, Universal Studios members or regular customers.
Overview of the App Design：
My entire software adopts a simple style with white and blue color scheme. The design of this color combination is clear and concise, the icons are intuitive and easy to understand, and the colors are bright, fully demonstrating the excitement and vitality of the theme park. I also hope to enhance the tourists' experience through the color combination. I aim to create a more convenient, immersive and enjoyable experience for both local and international tourists. The main purpose of this application is to help tourists plan their trips more efficiently, reduce waiting times, and obtain real-time information such as performance schedules, waiting times for rides, and location navigation, etc.
The detailed analysis of each interface is presented below.
HOME:
Click "search" to conduct the search.
Click the search box again and the keyboard will pop up.
Click on the discussion box on the right.
Join the discussion
Click "See More" to view more theme parks.
Or click on "notice", "hours", "reservation" and "itinerary" to view the sections you need.
MAP:
It is convenient to switch between list and map for quick location search.
Click "rides" to view the specific location of the project.
Click "shows" to view the specific location of the performance.
Click "events" to view the specific location.
Click "dining" to view the location of the restaurant.
Click "store" to view the specific location of the store.
Click "toilet" to view the specific location of the toilet.
TICKET:
Select ticket type
Select time
Choose whether to offer children's tickets or purchase VIP access
Select number of tickets
Enter personal information Select payment method
Payment successful
STORE:
Click on "hotel" to view hotel reservations.
Click on "packages" to enter the store and make a purchase.
Click "pass" to select "express passage"
Click "parking" to find the nearest parking lot.
Click on "express" and select "Express Delivery"
Click on "gift voucher" to select the gift.
Click on "VIP" to choose whether to purchase the annual card.
Click on "photo pass" and select the photo-taking service.
ME:
Check my ticket purchase history
Check my gift purchase history
Check my photo records
Check the theme park
AI Feedback Analysis：
Mr. Mohamed told me that in today's society, you need to learn to use tools. For instance, it's very difficult for you to identify the problems with your own app. So you can use AI to assist you and make your interface better.
And sometimes AI may make some incorrect judgments. In such cases, you should have your own judgment ability to determine whether this issue needs to be modified.
Old version homepage
1. The suggestions of AI：
The “1/5” pagination indicator is small and somewhat disconnected — try aligning it closer to the image or making it a carousel dot indicator for better clarity.
My understanding：
I don't think this needs to be modified because the 1/5 part is automatically switched to play, so I believe this is the part that doesn't require any changes.
2. The suggestions of AI：
Icon weights and styles (bottom navigation vs. mid-section) appear slightly different — unify stroke thickness and fill style.
Text capitalization is inconsistent (“BeiJing,” “Themed Lands,” “Purchase Now”) — standardise to sentence or title case for polish.
My understanding：
I think this issue is extremely crucial because I didn't notice that my font size was inconsistent at that time. I will take the suggestions into consideration and make the necessary revisions.
Mr. Mohamed's suggestion:
It is very necessary for my homepage to include a logo of Universal Studios, because it will be more eye-catching and better reflect the brand characteristics.
My understanding：
Mr. Mohamed is absolutely right. I will join in and ask where it would be best to place the AI.
The reply from AI：Is the logo a brand identifier or a functional element (for example, a clickable link to return to the homepage)?
If it is just an identifier, it should be subtle yet visible.
If it is an interactive (home button) type, it should be easily accessible and consistent with the application's navigation mode.
My understanding：
AI gave me three suggestions. In summary, one of them is to incorporate it into the carousel animation. However, I think this approach is not appropriate as it is not noticeable. The second option is to place it above the carousel animation. I think there is no more space available for any additional placement. The third one is placed to the left of the search bar and is vertically aligned. I think this arrangement is the best.
The revised homepage:
The modified interface has unified all the fonts to this style for better uniformity. The black font indicates the current page you are on, which is more convenient to use. The search button in the upper left corner has been compressed, and on the left, I have added the logo of Universal Studios. The blue and white logo also matches the color theme of my page.
Old version mappage:
1. The suggestions of AI：
There are many markers on the map, and the information points are somewhat crowded together.
Use slight color differences to distinguish different types of landmarks (for example, "rides" = blue, "food" = orange).
Adjust the spacing between the labels (numerical markings) and the icons, following the Law of Proximity (Playbook p.12–13) to prevent any element from overlapping.
Consider adding an enlargement or shadow highlighting effect to the currently selected attraction to enhance the focus.
My understanding：
I think what AI said is that it will change the icons on the map to different colors to distinguish them.
2. The suggestions of AI：
Top-level visual hierarchy
Currently, both the search bar at the top and the function icon bar are in a light blue background, which gives a slightly less distinct hierarchy:
Suggestion:
Add a slight shadow or a 1px divider line between the search bar and the function area to distinguish the hierarchy.
My understanding：
AI is absolutely correct and the suggestions are very reasonable. I don't think I would make any changes to the colors, but I can add a divider to distinguish the toolbar area from the map area.
And it is necessary to make the font of this page consistent with that of the main page.
The revised map page:
Old version ticket page:
1. The suggestions of AI：
Visual balance and spacing
The layout seems a bit heavy-handed; consider adding more vertical breathing space between the "Select Quantity" section and each type of ticket card.
The top title ("One-day Pass") can have more margin added to separate it from the date selector area.
My understanding：
I will adopt this suggestion and make improvements to it, because I don't know what the outcome will be after the improvements.
2. The suggestions of AI：
Comparison and button highlighting
The blue "OK" button may appear slightly brighter on a white background. Dim it by 10% to 15%,and change "OK" to "Next".
My understanding：
I think what AI said is completely correct. And I should change "ok" to "next" because this is just the first step of ticket purchase, not the final completion. So changing it to "next" would be better.
3. The suggestions of AI：
Accessibility considerations
Make sure that all the text (especially the smaller secondary text such as "Can be upgraded to annual pass") complies with WCAG contrast ratio (minimum 4.5:1).
The button targets (plus/minus signs) should be at least 44px square in size to allow for thumb operation.
My understanding：
I don't think this part needs to be changed. Because I have already adjusted the size of the buttons to be appropriate, and the small text prompts don't need to be overly large as it would greatly affect the user experience.
The revised ticket page:
Old version store page:
1. The suggestions of AI：
Injecting the brand's soul and the charm of the IP
Question: The current interface seems like a functional tool, lacking the magic, science fiction elements and joyous atmosphere that Universal Studios should have.
Thematic Design: Use corresponding thematic colors, fonts and icons in different IP areas (such as Harry Potter, Minions, Transformers).
Animation effects and sound effects: During key operations (such as successful purchase, receiving a quick pass), incorporate distinctive IP sound effects or subtle animation effects.
My understanding：
I think what AI said is correct. Compared to the homepage, this page indeed lacks some elements of Universal Studios. It would be better if some elements of Universal Studios were added.
However, I still hope that the store interface can be made more streamlined. Because for the home page and my interface, more elements related to Universal Studios can be incorporated.
2. The suggestions of AI：
Unify and simplify the store navigation. For the hotel details page: The "theme rooms" section should be presented using a similar information architecture, which will result in the loss of product information related to services and the inability to convey the sense of value.
My understanding：
And the "VIP" part can be removed as the menu above already has the "VIP" section, so the details of the hotel can be moved up.
The revised store page:
Old version me page:
1. The suggestions of AI：
The interface is too "simple", lacking the magic, technology and joy that Universal Studios should have. It is entirely composed of linear icons and gray text, with the brand colors missing.
Introduce brand colors. Apply the blue color of the "Join Now" button or the specific color of the Global Logo to key headings, icons, or dividing lines.
Icon upgrade. Change the current linear icons to planar icons, or use distinctive icons with IP elements (such as the "photo" icon in the shape of a little yellow man) for key functions.
My understanding：
That makes sense. I will make the necessary changes and incorporate more elements of Universal Studios to enhance the visitor's experience.
2. The suggestions of AI：
The display of "FANG YAOYUE" and the huge ID number is visually striking and poses a risk of privacy leakage. Calling the membership card a "Badge" (badge) is interesting but may cause misunderstandings.
Integrate the name and ID number into the "My Badge" card. By default, some ID digits (such as 33080220030512****) are hidden. Clicking on it will allow you to view the complete information.
My understanding：
This is a very detailed point. I didn't notice it before. I will modify this issue by hiding the name and only showing the surname.
The revised me page:
FEEDBACK
Week 1：
Looking back at the overall goal of the Universal Studios App project from last semester: Initially, we aimed to create a comprehensive app that not only offered ticket/reservation services but also enhanced the park visit experience (with maps, routes, and additional value-added services).
Week 2：
This week's focus was on interface prototypes and user flows: homepage entry design, ticket purchase, my itinerary, park reservation, online map, etc. modules.
Reflection: We placed many modules on the homepage, providing a very rich content entry point. However, when users first open the page, the amount of information is too large, which may cause a cognitive burden.
Week 3：
This week, Mr. Mohamed told us that we could use AI to help us identify problems because AI can consider things more comprehensively. However, you also need to have your own judgment ability because AI is not always correct. You need to make your own determination as to whether the changes are necessary or not.
Week 4：
This week, I followed the method suggested by Mr.Razif. I took screenshots of my interface and sent them to the AI. He helped me identify the problems, and I then made the final decision on whether to make any modifications. Many of the issues that the AI identified were indeed correct and were properly resolved. However, there are still some issues that I don't think are problems at all. They don't require any changes; in fact, changing them would make the experience even worse.
Week 5：
There are no classes on public holidays.
Week 6：
In the sixth week, we focused on Task 2. I also asked the AI to revise my questions and provided some reliable suggestions. I think the AI's analysis was very comprehensive. Mr. Razif reviewed my initial design and asked me to further refine the details.
Week 7：
In the seventh week, we tried out some simple animation production in class. In future projects, we will use these animations. Micro-interactions and macro animations are also very crucial in the app.
Week 8：
There was no feedback during the study week.
Week 9：
This week, we learned in class how to set up FlutterFlow and how to create a simple page with interactive features.
Week 10：
This week, under the guidance of Mr. Razif, we began the creation of the registration page and the login page. This is different from the previous Figma login and registration pages because the previous Figma was just an empty software, but this time we have created something that truly allows users to input their email and confirm the password.
Week 11：
This week in class, we started working on the page for the shopping process. Before this, all my designs were assembled like in Figma. But Mr. Razif told me not to make Flutterflow look like Figma. Later, I realized that Flutterflow is more like Lego. It's built layer by layer from the top, and you need to combine the contents in the screen using different components.
Week 12：
Only five or six students attended the class this week. I showed Mr. Razif my FlutterFlow, and he also taught me how to insert Lottie animations into my software. I wanted to insert an mp4 video animation into the app, but Mr. Razif said that was not possible. I think he is a very patient teacher. I showed Mr. Razif the current login, registration, main page, and store page that I have completed. He thought it was great and wanted me to continue.
Week 13：
There are no classes on public holidays.
Week 14：
There has been no feedback this week. We are concentrating on the final project.
REFLECTION
After modifying the design of my Universal Studios application, I gained a deeper understanding of how user experience and visual communication work together to create an engaging digital product. I realized that my initial design lacked a clear hierarchy and visual balance. For instance, the homepage was too crowded and some navigation buttons were not easily noticeable. In my updated version, I simplified the layout, added the Universal Studios logo to the homepage, and incorporated more Universal Studios elements into my interface to enhance the immersion. I chose to retain some of my initial creative choices, such as using an interesting color scheme, to maintain a fun and immersive theme consistent with the Universal Studios experience. I also learned to distinguish between the AI's suggestions, some of which were good and some were not. I only kept the useful suggestions. It made me understand that feedback should not be regarded as criticism but rather as an opportunity to improve design thinking and problem-solving skills.
评论
发表评论