HCI Project Part 3
"Project Part 3 "
Developing alternative designs
"Conceptual & Physical Design"
Storyboards
Task 1: Notifying about bringing books & materials
Task 2: Giving homework feedback
Task 3: Give extra homework to academically weak students
Alternative Designs
The images below contain the votes of each member in different colors.
Radowan's Designs:
Muaz's Designs:
Tuhin's Designs:
Taimon's Designs:
Sami's Designs:
Wireframes
Task 1: Notifying about bringing books & materials
For Teacher -
Justification:
Similarity:
The tabs on the teacher's home page exhibit the principle of similarity, as they share a consistent style, emphasizing their collective functionality. Each tab, prominently displayed and adorned with a uniform design, signals its role in the teacher's primary tasks within the system. Notably, the tabs for "Give Homework" and "Materials" showcase similar visual characteristics, reinforcing their shared nature as notification tools.
Proximity:
Proximity is effectively implemented in the teacher's wireframes, particularly on the home page. The tabs related to general notifications, such as "Give Homework" and "Materials," are grouped closely at the top of the screen, establishing a visual relationship. Simultaneously, the tabs for more specific actions, like "Extra Exercise" and "Give Feedback," are arranged together but with a visible gap from the general notification tabs. This separation signifies distinct functions while maintaining an intuitive layout.
Enclosure:
The home page of the teacher's interface expertly employs the principle of enclosure. The main activity tabs, serving notification purposes, are enclosed within a rectangle. This enclosure not only organizes the tabs but also distinguishes them as a cohesive set for task completion. The use of rectangles serves as visual boundaries, enhancing clarity and reinforcing the enclosed content's significance.
Continuation:
Continuation is skillfully implemented in the teacher's wireframes, guiding the user's eye through the interface. The background's subtle curve behind the top section of the middle rectangle naturally leads the eye toward the central portion containing the primary activity tabs. This design element aids in creating a seamless flow and draws attention to the crucial components of the interface.
Figure and Ground:
The principle of figure and ground is effectively applied in various elements of the teacher's wireframes. The main activity tabs, enclosed in a rectangle with a slight shadow, act as the figure against the background. When the calendar icon is activated, a pop-up calendar becomes the figure against the shadowed background, ensuring clear visibility and interaction. Similarly, pop-up messages, such as "Material notification posted," utilize the figure and ground concept, enhancing readability and user focus.
Symmetry and Order:
Symmetry plays a significant role in the teacher's wireframes, contributing to a balanced and aesthetically pleasing design. The arrangement of the four main tasks in equal divisions on the left and right of the screen establishes symmetry, creating visual harmony. The center-aligned school logo at the top of the screen serves as a focal point, adding a touch of order to the overall design. Symmetrically centered pop-ups further enhance the user experience, providing a structured and visually appealing interface.
Common Fate:
The news tabs at the bottom of the home page aptly utilize the common fate principle. The visual design suggests a horizontal sliding motion, implying that all tabs share the "fate" of being swiped together. This intuitive grouping encourages users to perceive these tabs collectively, enhancing the overall user experience through a cohesive and predictable interaction.
Design requirement incorporation:
The wireframes for the teacher's interface seamlessly preserve the crucial actions of checking upcoming topics, selecting relevant books, and notifying students, as outlined in the "What to Keep?" analysis. Simultaneously, the design introduces innovative features like a digital notification system and an integrated calendar, addressing the identified "What to Re-design?" aspects. This modernization enhances the teacher's experience by providing an efficient, streamlined means of communication and proactive planning. The wireframes successfully amalgamate contemporary practices with foundational elements, ensuring that teachers can navigate their responsibilities with improved effectiveness and technological support.
For Student -
Justification:
Similarity:
The home page for students mirrors the design of the teacher's interface, featuring prominent main task tabs at the top, allowing seamless navigation. The tabs, namely "See Homework," "Materials," "Extra Exercise," and "See Feedback," maintain the same design style as those in the teacher's interface, highlighting their shared functionality. This uniformity ensures consistency across user interfaces, making it intuitive for students who are already familiar with the teacher's interface.
Proximity:
In the student's home page, the "See Homework," "Materials," "Extra Exercise," and "See Feedback" tabs are grouped closely together, conveying their shared importance. This proximity signals to the student that these tabs are directly related to their daily academic activities, creating an association between these functions. Additionally, in the materials updates page, subject tabs are clustered together, emphasizing their collective purpose of displaying material updates from teachers for different subjects.
Enclosure:
The student's home page adopts the same design principle of enclosure as the teacher's interface. The main task tabs, enclosed within a rectangle, distinguish this section from other components on the screen. This visual separation enhances the clarity of the student's primary actions, maintaining consistency with the teacher's interface and contributing to a cohesive design.
Continuation:
The continuation principle is maintained in the student's home page, as the background curvature subtly guides the user's attention towards the central section containing the main task tabs. This design element ensures a smooth flow of visual hierarchy, similar to the teacher's interface, creating a natural progression for the student to focus on the core functionalities.
Figure and Ground:
Similar to the teacher's interface, the student's home page employs the figure and ground principle. The main task tabs, enclosed within a rectangle with a slight shadow, distinguish this section as the figure against the background. When a subject tab is clicked, displaying the latest material notification as a popup, the notification becomes the figure against the shaded background, enhancing visibility and clarity for the student.
Symmetry and Order:
The student's home page maintains symmetry and order, aligning with the teacher's interface. The four main task tabs are evenly distributed, contributing to an aesthetically pleasing and well-organized layout. This alignment ensures a balanced visual presentation, emphasizing the importance of each task, consistent with the teacher's interface.
Common Fate:
In the home page's news section, the student's interface shares the common fate principle with the teacher's. The news tabs, displaying potentially slide-able content, convey a collective association. This design choice encourages the student to perceive all news tabs as part of the same group, facilitating a cohesive user experience.
Design requirement incorporation:
By introducing features like automated notifications or reminders directly to students' devices, the app enhances the student experience. Redesigning the process involves integrating a notification center within the app, allowing students to receive and review notifications systematically. This shift eliminates the dependence on verbal communication and manual note-taking, promoting a more streamlined and accessible approach to staying informed about upcoming tasks. Additionally, the design retains the action of referring to the notification and taking books for the next class, ensuring a seamless transition from the existing manual process to the digital platform. The redesign focuses on providing students with a user-friendly interface to access and comprehend notifications easily, aligning with the digital age's efficiency and immediacy.
For Parent -
Justification:
Similarity:
The main task tabs in the home page for parents are analogous to those in the teacher's and student's interfaces. These tabs, namely "See Homework," "Materials," "Extra Exercise," and "See Feedback," are designed with similar appearances, emphasizing their shared functionality across different user roles.
Proximity:
Just like in the student's interface, the main task tabs in the home page for parents are grouped closely together. The names of the tabs are distinct, yet their proximity implies that they collectively serve a related purpose. This spatial arrangement facilitates an immediate association between the tabs, allowing parents to quickly identify the specific tasks they can perform within the app.
Enclosure:
The enclosure principle is applicable to the home page for parents, mirroring the teacher's and student's interfaces. The main activity tabs are encompassed within a rectangular shape, setting them apart from other components on the screen. This enclosure signifies that these tabs collectively contribute to completing tasks of the same genre for parents as well.
Continuation:
Similar to the student's interface, behind the top part of the middle rectangle in the home page, the background shape curves and goes behind that rectangle. This visual cue naturally guides the eye toward the middle section, highlighting the importance of the tabs contained within it.
Figure and Ground:
The home page for parents employs the figure and ground principle similarly to the student's interface. The main activity tabs, enclosed within a rectangle with a slight shadow, create a distinct figure against the background. This shadowing effect emphasizes the significance of these tabs and contributes to their prominence within the design.
Symmetry and Order:
The use of symmetry is maintained in the home page for parents, just as in the teacher's and student's interfaces. The four main tasks are evenly distributed on the left and right sides of the screen, providing a balanced and organized visual layout. This symmetry enhances the aesthetics of the interface and contributes to a harmonious user experience.
Common Fate:
The common fate principle in the parent's home page news section replicates that of the student's interface. The news tabs at the bottom of the screen convey a sense of shared destiny, suggesting they can be swiped horizontally as a collective group. This encourages parents to associate these tabs under the same context of news updates related to their child's academic activities.
Design requirement incorporation:
The design recognizes the parental role in overseeing their child's preparedness, and thus, it retains the process of parents utilizing the notification to instruct their child to bring the necessary books. Simultaneously, the redesign focuses on enhancing parental involvement through the introduction of a dedicated parent portal or direct notifications to their devices. This eliminates the need for physical access to the student's notebook, ensuring parents receive timely information about upcoming class requirements. The re-design aligns with the digital age, providing parents with a more direct and efficient channel to stay informed, fostering a collaborative approach to supporting their child's education.
Task 2: Giving or receiving homework feedback
For Teacher -
Justification:
Similarity:
The interface maintains consistency with the teacher's previous task by featuring the same main task tabs on the home page. These tabs, such as "Give Homework" and "See Feedback," are similarly designed, signifying their shared functionality in providing a streamlined user experience. Additionally, the "Upload Feedback" page incorporates elements from the previous task, including year-selecting buttons and a subject-selecting drop-down menu. This maintains a cohesive design language across different functionalities, making it easier for the teacher to navigate and understand.
Proximity:
Similar to the previous interface, the home page continues to display main task tabs in close proximity to each other, creating a visually coherent group. This proximity communicates that these tabs serve related functions within the system. On the "Upload Feedback" page, the year-selecting buttons are grouped closely together, reinforcing their collective purpose. This design choice enhances user efficiency, as it encourages the teacher to interact with components that share similar functionalities in a logical order.
Enclosure:
The home page retains the enclosure concept with a rectangular border containing the main task tabs. This design choice separates these tabs from the background, emphasizing their significance. Similarly, the "Upload Feedback" page features text input fields enclosed in borders, providing a clear visual distinction from the surrounding white space. This enclosure effect prompts the teacher to recognize these fields as interactive components, enhancing the overall user interface.
Continuation:
Continuity is maintained from the previous interface with the home page's layout, featuring the main task tabs positioned similarly to guide the user's attention. The "Upload Feedback" page continues this theme by presenting the year-selecting buttons in a vertical alignment below each other. This symmetrical arrangement aids the teacher in navigating and interacting with the interface intuitively, contributing to a seamless user experience.
Figure and Ground:
The home page preserves the figure and ground concept by presenting the main task tabs as the figure against a background, creating a distinct visual hierarchy. In the "Upload Feedback" page, the pop-up notification, indicating that the feedback has been sent to the student, utilizes shadowed background, distinguishing the notification as the figure. This design choice enhances the teacher's focus on critical information, providing a clear indication of completed actions.
Symmetry and Order:
Symmetry is evident in the home page's layout, maintaining a balanced distribution of main task tabs on either side of the screen. The "Upload Feedback" page further emphasizes symmetry with the vertical alignment of year-selecting buttons, creating an organized and visually appealing arrangement. This symmetry promotes a sense of order and structure, contributing to an aesthetically pleasing and user-friendly interface.
Common Fate:
The common fate principle is evident in the home page's news section, where the tabs slide horizontally in unison. This consistent movement reinforces the idea that these tabs share a common purpose of displaying news updates. In the "Upload Feedback" page, the subject-selecting drop-down menu exhibits a similar behavior, as all subject options move into the designated field upon selection. This common fate effect streamlines the interaction process, making it intuitive for the teacher to select and manage subjects efficiently.
Design requirement incorporation:
It keeps the fundamental action of evaluating and providing feedback on students' homework, ensuring the teacher's role in guiding students' learning journeys remains consistent. The design retains the teacher's ability to assess assignments, offer constructive feedback, and support students' academic growth. Simultaneously, the redesign introduces a digital interface for teachers to upload feedback efficiently, enhancing the feedback loop. Furthermore, the redesign considers the introduction of a system for tracking and managing students' progress over time, offering valuable insights for teachers to identify trends or areas that may require additional attention. This enhances the teacher's ability to provide targeted support and fosters continuous improvement in students' academic performance.
For Student -
Justification:
Similarity:
The main task tabs in the home page for task 2 are identical to those in task 1, maintaining a consistent design and functionality. The tabs, now labeled as "See homework," "Materials," "Extra Exercise," and "See feedback," are visually similar, ensuring that students can easily recognize and understand their purpose. This design similarity contributes to a seamless user experience, allowing students to navigate between tasks effortlessly.
In the "See feedback" page, the layout and structure are maintained from the "Materials update" page in task 1. The subject tabs display the same design, emphasizing their common functionality of providing updates or information from the teacher. This consistency ensures that students can anticipate and understand the organization of the interface, fostering user familiarity.
Proximity:
The main task tabs in the home page maintain the same proximity as in task 1, contributing to a cohesive and organized layout. The tabs are grouped closely together, emphasizing their shared importance in the student's interaction with the app. This grouping by proximity helps students quickly identify and access the tasks they need, promoting efficiency in navigation.
In the "See feedback" page, the subject tabs are closely aligned, appearing right below each other. This proximity reinforces their collective purpose and suggests that they function as a cohesive group for accessing feedback from different subjects. The close arrangement aids in grouping similar elements, facilitating a user-friendly experience.
Enclosure:
The home page retains the enclosure design, with the main task tabs enclosed in a rectangle. This consistent enclosure highlights the significance of these tabs and separates them from other components on the screen. The enclosed design contributes to visual hierarchy, guiding students' attention to the primary actions available to them.
Similarly, in the "See feedback" page, the subject tabs are enclosed within their own borders. This enclosure reinforces the idea that these tabs represent distinct categories, allowing students to associate them with specific subjects. The bordered design contributes to clarity and user understanding.
Continuation:
The continuation principle is sustained in the home page, where the background shape behind the main task tabs guides the user's attention toward the central area. This design element creates a natural flow, leading the user's eyes to the main tasks and encouraging interaction.
In the "See feedback" page, the continuation principle is maintained as the subject tabs are arranged vertically, allowing users to scroll through them in a logical order. This continuation in layout enhances the user's experience by providing an organized and predictable structure.
Figure and Ground:
The home page maintains the figure and ground principle, with the main task tabs standing out as the figure against the background. This clear contrast ensures that users can easily identify the main interactive elements on the screen.
In the "See feedback" page, when a specific subject tab is selected, the corresponding feedback notification appears as a popup. In this context, the notification becomes the figure, distinct from the shaded background. This design choice enhances the visibility and prominence of feedback information for the user.
Symmetry and Order:
The symmetry and order principle is upheld in the home page, where the main task tabs are symmetrically arranged on both sides of the screen. This balanced design contributes to a visually pleasing layout, promoting a sense of order and structure.
Similarly, in the "See feedback" page, the subject tabs exhibit symmetry as they are evenly spaced and aligned. This symmetrical arrangement reinforces a sense of order and organization, aiding users in quickly locating and selecting the desired subject for feedback.
Common Fate:
The home page's news section maintains the common fate principle, where the news tabs suggest a vertical sliding motion. This design element implies that all tabs share a common fate of being scrolled vertically, grouping them under the same context.
In the "See feedback" page, the subject tabs exhibit a common fate as they can be navigated vertically. This design choice ensures consistency and coherence, allowing users to apply a familiar interaction pattern when exploring feedback for different subjects.
Design requirement incorporation:
It maintains the essential actions of receiving feedback, understanding areas for improvement, and actively engaging with the feedback for academic growth, ensuring a smooth transition for students. The app preserves the user-friendly platform for comprehending feedback and emphasizes the importance of self-assessment and improvement in the learning journey. The redesign introduces features such as automated notifications for prompt access to new feedback, fostering a proactive approach to student self-assessment. The continued user-friendly experience includes efficient navigation within the "See feedback" page, enabling students to switch seamlessly between subjects for a comprehensive review. These design considerations align with the overarching goal of enhancing the student experience by providing a streamlined and accessible platform for feedback engagement.
For Parent -
Justification:
Similarity:
The main task tabs in the home page for parents are consistent in style, creating a cohesive and visually unified interface. The "See Feedback" page maintains a similar design approach, ensuring that parents can easily recognize and navigate different sections of the app. The alignment and formatting of elements within the parent interface provide a sense of familiarity and predictability.
Proximity:
Within the "See Feedback" page, subject tabs are grouped closely together, emphasizing their collective relevance. This proximity helps parents associate related elements, promoting efficient navigation. The main task tabs in the home page are strategically placed to facilitate easy access, ensuring that parents can quickly locate and engage with different features.
Enclosure:
Borders around elements in the "See Feedback" page serve as effective enclosures, distinguishing various sections and providing visual clarity. The use of borders ensures that parents can easily identify and interact with specific components, contributing to a user-friendly experience. The home page also utilizes enclosure principles, creating distinct sections for different tasks.
Continuation:
The layout of the "See Feedback" page follows a logical continuation of elements, such as the vertical arrangement of year selecting buttons. This ensures a smooth flow in the parent interface, guiding users through a structured and organized experience. The consistent continuation of design elements contributes to a seamless interaction.
Figure and Ground:
Notifications within the parent interface, such as the pop-up displaying feedback from the teacher, adhere to figure-ground principles. When parents click on a subject tab, the feedback pop-up becomes the prominent figure against a slightly shadowed background. This intentional contrast enhances the visibility of crucial information, ensuring that parents can easily focus on and comprehend the feedback provided by teachers.
Symmetry and Order:
The symmetrical placement of year selecting buttons within the "See Feedback" page contributes to an organized and balanced visual presentation. Symmetry promotes a sense of order, making it easier for parents to understand the layout and locate specific functionalities. The overall design maintains a consistent sense of symmetry for a harmonious user experience.
Common Fate:
The horizontal navigation of news tabs in the home page for parents follows the common fate principle. These news tabs move collectively, encouraging parents to associate them as part of the same navigational category. Whether scrolling through notifications or exploring various updates, the cohesive movement of these elements creates a sense of unity and interconnectedness. Similarly, the vertical navigation of subject tabs within the "See Feedback" page adheres to the common fate principle, reinforcing the idea that these tabs share a collective purpose in presenting subject-specific feedback.
Design requirement incorporation:
The layout maintains the same actions as the student in terms of receiving notifications about feedback, allowing parents to stay informed about their child's academic progress. The design recognizes the parental role in overseeing their child's education, and thus, it retains the process of parents utilizing the feedback notifications to understand their child's performance. Simultaneously, the redesign focuses on enhancing parental involvement through the introduction of a dedicated parent portal or direct notifications to their devices. This eliminates the need for physical access to the student's notebook, ensuring parents receive timely information about their child's academic achievements and areas that may require attention. The re-design aligns with the digital age, providing parents with a more direct and efficient channel to stay informed, fostering a collaborative approach to supporting their child's education.
Task 3: Give extra homework to academically weak students
For Teacher -
Justification:
Similarity:
The home page for teachers, consistent with Task 1, employs similar main task tabs that include "Give Homework," "Materials," "Extra Exercise," and "Give Feedback." These tabs are of the same style and size, signifying their shared main functionality. Additionally, the "Extra Exercise" page incorporates a similar design language with year-selecting buttons, akin to the teacher's materials upload interface. The Subject-selecting drop-down menu maintains the same style, reinforcing a shared design pattern for selecting subjects. The "View Student List" button within the "Extra Exercise" page further aligns with this principle, presenting a list of student names enclosed in rectangles, indicating their common functionality.
Proximity:
The home page maintains the same layout as Task 1, with main task tabs grouped together at the top, ensuring a consistent user experience. Similarly, the "Extra Exercise" page features year-selecting buttons in close proximity, fostering a connection among these elements. The subject-selecting drop-down menu, student list selecting button, and the "Upload Question Link" text input field have sufficient space between them, emphasizing their distinct functions. This spacing aids in preventing user confusion by clearly delineating different interactive elements within the interface.
Enclosure:
The home page design replicates the enclosure concept from Task 1, with a rectangle encompassing the main activity tabs, providing a visual separation from other components. In the "Extra Exercise" page, the "Upload Question Link" text field is enclosed in borders, emphasizing its distinct interactive nature. This enclosure assists in enhancing the visual hierarchy and user understanding of clickable elements, contributing to a more intuitive design.
Continuation:
Consistent with Task 1, the home page for teachers maintains a continuous visual flow, with the background shape curving and guiding attention toward the central section containing main activity tabs. The "Extra Exercise" page maintains a vertical alignment of year-selecting buttons, promoting a sense of order and continuity. The presentation of the student list with a slide bar indicates a continuation, conveying to the user that more student names are accessible by vertically scrolling.
Figure and Ground:
The home page retains the use of a rectangle with a slight shadow as a background, highlighting the main task tabs as the figure. In the "Extra Exercise" page, the "Extra Exercise sent to all selected students!" notification appears as a pop-up, with a shadowed background, clearly distinguishing it as the figure against the grounded background. This design choice aids in focusing the user's attention on important notifications.
Symmetry and Order:
Similar to Task 1, the home page maintains a symmetrical layout, with main activity tabs evenly distributed on both sides, contributing to a visually pleasing and organized design. The "Extra Exercise" page continues this principle with symmetrical year-selecting buttons, reinforcing their shared functionality. This symmetry promotes a sense of order, making it easier for users to understand and navigate the interface.
Common Fate:
The home page employs the common fate principle with the horizontal navigation of news tabs at the bottom, indicating they can be swiped horizontally. In the "Extra Exercise" page, the vertical arrangement of student names and the presence of a slide bar on the right convey the common fate of being vertically scrolled, providing a convenient way to view and select students. This consistency contributes to a cohesive and predictable user experience.
Design requirement incorporation:
The "Extra Exercise" functionality retains the essential actions of identifying academically weak students and assigning them additional exercises for improvement, aligning with the "What to Keep?" requirement. It continues to provide a proactive approach to offering tailored support for struggling students, ensuring that the process of assigning extra exercises remains a key feature. The introduction of a feature where teachers can post questions and include multiple answer options aligns with the "What to Re-design?" aspect, offering a more interactive and engaging way for students to access and respond to additional exercises. Additionally, the ability for teachers to view student responses on the online question creating website enhances the feedback loop, allowing them to monitor and assess the effectiveness of the extra exercises assigned.
For Student -
Justification:
Similarity:
In the "Extra Exercises" interface, the subjects are presented in a list, styled uniformly with similar fonts and sizes, providing a consistent appearance. This maintains similarity across subjects, indicating their shared functionality. The design ensures that all subjects in the list have the same visual characteristics, allowing the user to associate them with a common purpose.
Proximity:
On the "Extra Exercise" page, the list of subjects is enclosed in rectangles and positioned closely together. This proximity communicates that these subjects form a cohesive group with related functionality. The grouping of subjects within distinct rectangles helps users recognize their interconnectedness, suggesting that they serve a collective purpose within the task.
Enclosure:
The "Extra Exercise" page features a notification, "For your extra exercise, click here," presented within a distinct rectangle with a darker color. This enclosure separates the notification from the surrounding content, drawing attention to its significance. The use of a bordered rectangle highlights the notification and visually sets it apart, contributing to a clear and focused user experience.
Continuation:
The list of subjects on the "Extra Exercise" page extends continuously to the end of the screen, emphasizing a seamless continuation. The subjects are aligned in a manner that allows for vertical scrolling, indicated by the presence of a slide bar on the right side. This design suggests an orderly flow, providing users with an intuitive way to explore the complete list.
Figure and Ground:
The notification "For your extra exercise, click here" appears as a pop-up on the "Extra Exercise" page, with the background shadowed. This design creates a clear distinction between the figure (the notification) and the ground (the shadowed background), ensuring that the message stands out prominently. The use of shadowing enhances the visual hierarchy, making the notification easily noticeable.
Symmetry and Order:
The subject names within rectangles on the "Extra Exercise" page maintain a consistent and symmetrical design. Each rectangle follows the same pattern, contributing to an organized and ordered appearance. Symmetry in the layout of subject names enhances visual appeal and helps users perceive a systematic arrangement.
Common Fate:
The presence of a slide bar to the right of the "Extra Exercise" page indicates that the subjects share a common fate—they can be vertically scrolled to reveal more options. This visual cue suggests a collective behavior for the subjects, reinforcing the idea that they are part of a cohesive set with a shared navigational direction.
Design requirement incorporation:
The design for the "Extra Exercises" task for students incorporates essential elements to fulfill the identified requirements. The interface maintains the existing workflow, allowing students to access additional exercises as targeted practice for improvement. The subjects list, styled uniformly, adheres to the "what to keep" aspect, ensuring familiarity in receiving extra exercises. To enhance the student experience, the app introduces a vertical navigation style for the subjects, optimizing usability and aligning with the redesigned approach. The continued use of rectangles around subject names maintains a systematic and organized appearance. The redesigned interface introduces a slide bar, offering students an efficient way to vertically scroll through subjects. This aligns with the "what to redesign" aspect by enhancing navigation and providing a more user-friendly platform. The overall design retains the essence of personalized learning, addressing individual academic needs while incorporating improvements for a streamlined and accessible approach.
For Parent -
Justification:
Similarity:
The "Extra Exercises" task for parents maintains a consistent design with the main task tabs in the home page, fostering visual continuity and reinforcing the parent's sense of familiarity across different app sections. Additionally, the list of subjects within the "Extra Exercises" page is styled uniformly, adhering to the principle of similarity. This uniformity ensures that parents can easily recognize and navigate the various subjects, creating a cohesive and user-friendly experience.
Proximity:
The home page and the "Extra Exercises" page for parents maintain a consistent layout, with the main task tabs and subject lists strategically placed to optimize user experience. In the "Extra Exercises" page, the close proximity of subjects enclosed in rectangles signifies their association, presenting a visually grouped set of subjects. This proximity aids parents in quickly identifying and interacting with specific subjects related to their child's extra exercises.
Enclosure:
The parent's interface for the "Extra Exercises" task incorporates the enclosure principle by presenting important notifications, such as the child's extra exercise mark received, within distinct rectangles. The use of rectangles, especially in pop-ups with lighter-colored backgrounds, serves as an enclosure, effectively highlighting crucial information. This design choice enhances the visibility of notifications, ensuring parents can easily recognize and respond to important updates.
Continuation:
The "Extra Exercises" page for parents aligns with the continuation principle by extending the list of subjects throughout the screen, providing a seamless flow of information. The inclusion of a slide bar on the right indicates that the screen is vertically scrollable, allowing parents to explore additional subjects efficiently. This continuation promotes a user-friendly interface, accommodating various subjects without compromising accessibility.
Figure and Ground:
The parent's interface for the "Extra Exercises" task employs the figure and ground principle effectively. The child's extra exercise mark received notification, presented as a pop-up with a shadowed background, ensures that the notification is the figure. This design choice highlights the importance of the notification against the shadowed ground, improving visibility and drawing immediate attention to significant updates.
Symmetry and Order:
The "Extra Exercises" page for parents adheres to the principle of symmetry and order. Subject names are enclosed in rectangles with consistent design and alignment, creating a visually balanced and organized layout. This symmetry enhances the overall aesthetic appeal and helps parents quickly locate and engage with specific subjects, contributing to a harmonious and structured interface.
Common Fate:
The inclusion of a slide bar to the right of the screen in the "Extra Exercises" page for parents aligns with the common fate principle. This design choice communicates that all subjects share a common fate—being vertically scrollable and clickable. Parents can easily navigate through subjects using the slide bar, promoting a cohesive and intuitive interaction pattern.
Design requirement incorporation:
The "Extra Exercises" task for parents successfully incorporates the design requirements by maintaining the fundamental actions of viewing and acknowledging extra exercises assigned to their child. It upholds the process of parents accessing a list of subjects related to their child's extra exercises, fostering informed parental involvement. Simultaneously, the redesign introduces a dedicated notification for when the child's extra exercise marks are received, enhancing the parent's awareness and engagement. This aligns with the overarching goal of providing parents with direct insights into their child's academic challenges and achievements, creating a more collaborative and supportive approach to address academic concerns.
Interaction Metaphors
For the teacher's interface:
Years as Button: The metaphor here is that of a button, where a specific year becomes "active" upon selection. This aligns with the idea of a button being pressed to initiate an action, in this case, the teacher starting the process of sending a notification to the selected year's students.
Calendar as Date Picker: The calendar interface functions as a metaphor for a physical calendar, but with interactive elements. Each date acts as a button, allowing the teacher to intuitively assign a date for materials bringing. This design choice aligns with current mobile app standards for date selection, making the process familiar and user-friendly.
View Student List as Menu: The "View Student List" button metaphorically represents a menu where the teacher is presented with a list of options (students). Clicking on a student's name and having a tick mark appear conveys a sense of making a selection from a menu, providing a visual metaphor for the interaction.
For the student's interface:
Notification Tabs with Count: The metaphor of a container is used, where the main action tabs have a small circle with a number, indicating pending notifications. This container metaphor communicates that these tabs hold information, and the count signifies how many items (notifications) are within the container.
Teacher Messages as Physical Mail: The pop-up format of teacher messages follows the metaphor of a physical mail letter. The "From: teacher name" at the top, along with the content enclosed in a rectangle, resembles the format of receiving a handwritten mail through traditional postal services. This metaphor creates a sense of familiarity in using the app.
For the parent's interface:
Notification Tabs with Count: Similar to the student's interface, the metaphor of a container is employed for the main action tabs. The small circle with a number at the top right corner of these tabs signifies a container with pending notifications. This metaphor communicates that these tabs contain important information, and the count indicates the number of unread items within the container, prompting parents to check and stay informed.
Teacher Messages as Physical Mail: This metaphor is also similar to the student's interface as the interfaces are almost identical. The format of teacher messages as pop-ups follows the metaphor of a physical mail letter. Including "From: teacher name" at the top, along with the content enclosed in a rectangle, mirrors the traditional way of receiving handwritten mail through postal services, except that the parent is reading a 'letter' that was sent from the teacher to their
Common for All Interfaces:
Distinctive Main Action Tab Icons: Each main action tab across all interfaces incorporates a unique icon as a metaphor for its function. The "Give Homework" or "See Homework" tab features a notification icon with multiple lines, symbolizing important tasks. The "Materials" tab uses a document icon stacked to convey information about materials, mainly textbooks. The "Give Feedback" or "See Feedback" tab utilizes a speech bubble icon, signifying communication and thought processes between teachers and students. The "Extra Exercise" tab employs a dumbbell icon, suggesting an analogy between physical and academic exercise, implying that academic strength can be developed through practice.
Home Icon for Navigation: A house icon is consistently placed at the top right corner of all pages except the home screen, serving as a metaphor for navigation. This icon represents "home," indicating that clicking on it will lead users back to the home screen. The home icon provides a universal and user-friendly means of navigation, ensuring a consistent experience across all interfaces.
News Tab Structure: The news tabs at the bottom of the home page share a structure featuring a picture to the left and text to the right. This layout is inspired by traditional newspaper formats, where information is presented with an accompanying image. The metaphor of a newspaper layout enhances the readability of news content, making it visually appealing and familiar to users.
Comments
Post a Comment