Skip to content

Latest commit

 

History

History
92 lines (50 loc) · 4.97 KB

1.4 - Low-Fidelity Mockups and Course Topics Aligning with Designs.md

File metadata and controls

92 lines (50 loc) · 4.97 KB

Low-Fidelity Mockups for RCE Saskatchewan

1. General Improvements

1.1 Main Menu Section

1.2 Footer Section

1.3 Sticky Menu

1.4 Pagination

1.5 Back to Top button

1.6 Subscribe Newsletter

2. User Experiences

2.1 Blog

2.1.1 Blog (with left side bar)

2.2 Contact Us

2.3 Live Chat

2.4 Adding Blogs, Events, and Resources

2.5 "Call Us for Help" using Get Involved Menu

2.6 Donate

2.7 News

Rationale for Course Topics Aligning with Designs

  1. Gestalt Principles
  • Proximity - The menu arrangement is done in a way that places related experiences close to each other (i.e. in the same menu) so that the user-expereince remains smooth and effortless.
  1. Constructivism
  • By following the first lecture (teaching philosophy), we understand Constructivism in education meaning learning to focus on how we actively create (or “construct”) knowledge out of our experiences.
  1. Discoverability & Understandability
  • By following Norman’s doors, a story we understand how Discoverability (What action is required and how to perform them) and Understandability (Meaning of sign and how design is used, what are the various settings and controls means) is needed for good design. As well as, we considered Low threshold, high ceiling concept for our design. it means the user can easily learn then and become master by following step by step process.
  1. Gulf of Execution and Gulf of Evaluation
  • When a non-experience user comes they face these two problems. So, our goal is to bridge these two gulfs by using our design. That's why we add some new ideas like a sticky menu, back to top button, footer section, Blog sidebar, search box, etc.
  1. False-consensus effect
  • By following this theory, we are not users we create low fidelity design using our empathy mapping. As well as, we also followed human thoughts concept for making our design.
  1. High-level Process
  • By this, first, we decided our target customer for our design. Then, we thought of their needs and desires in the context of their real-life situations. After that, we tried to build this idea in a visual way. Then, from the last meeting with RCE members, we evaluated the prototypes with customers to get feedback and learn what they needed so that we know what to focus on in the future. So, now in our high-fidelity design we will try to refine our prototype design again accordingly.
  1. Natural mappings
  • We used this concept for deciding the perfect place for content so that the user can easily understand the meaning of this and it will help them to use these tools.
  1. Metaphor
  • We used this concept to see how content looks like in a symbolic way so someone can understand the meaning of this easily. For example, the search tool symbol (magnifier glass or magnifier glass with the word search), menu-bar( 3 lines horizontally), My Account(user icon), Back to top icon (showing upper arrow in a right-bottom corner), Chat icon (looks like comment symbol), Social icon symbol, Mail symbol for email, location symbol for address, phone symbol for a contact number, video call (film recorder symbol), Notification(bell symbol), settings (3 dots horizontally), drop-down( down triangle), Pagination(two greater than sign together), Required (red star), etc.
  1. Tunnel vision & Fresh Snow
  • Following this concept, we did some brainstorming for ideas and focused on quantity instead of quality for creating empathy mapping then marinated our ideas before creating our low fidelity mockups.