Designing Well or Designing Good – How about Both?

Students will design and build a prototype charity website that raises awareness or support for a cause they care about (e.g., protecting wildlife, reducing waste, supporting mental health, etc.). Using Design Thinking, students empathize with potential users, define goals, ideate, prototype using a free website builder, and test their design using UX feedback methods.

• Computer and internet access are required. These are some free website builders for students
  • Wix Tomorrow — Specifically for ages 13–18, supports drag-and-drop, templates, and UX exploration. (https://www.wix.com/tomorrow)
  • Weblium Kids — Designed for kids/teens; easy for first-time designers; great visual interface. (https://weblium.com/make-website-for-kids)
  • Google Sites — Free with Google accounts, simple for school projects, no ads, easy collaboration. (https://sites.google.com)
  • Tilda Education Plan — Offers student-friendly templates and easy drag-and-drop. (https://tilda.cc)
• WIE Manage Stories Riko-chan and the Dental Adventure

Empathize: Research a local or global charity cause. Interview or survey classmates about what would motivate them to support a cause online.

Define: Write a clear problem statement, e.g., ‘Teenagers in our school don’t know how to donate to local food banks online.’

Ideate: Brainstorm features and content: donation button, videos, story section, volunteer sign-up. Create a rough site map or storyboard.

Prototype: Build a simple version of the site using a free builder. Assign team roles: designer, content writer, tester, etc.

Test: Ask peers or teachers to navigate the site and fill a short feedback form about usability, design appeal, and clarity. Students can test and evaluate their sites by creating peer surveys (or using supplied survey forms), as well as observing navigation behavior, conducting short feedback interviews, and comparing before-and-after revisions.

Once the testing is completed, analyze the results and use them to improve the website.

If time permits, test again until the team feels the website is ready to be released

Assessment Criteria

• Design Thinking Process: Evidence of research, brainstorming, and iteration
• UX / Layout Design: Clarity, accessibility, aesthetic appeal
• Functionality: Site is easy to use, links work, readable
• Empathy & Purpose: Website communicates cause effectively
• Presentation & Reflection: Students explain choices and improvements

• Human Factors – an applied field of study that examines human abilities, limitations, behaviors, and processes.
• Human Centered Design – design which include the human perspective throughout the design process
• Design Thinking Process – is a mindset and approach to problem-solving and innovation anchored around human-centered design
• User Centered Design – the process used to create a product by putting users at the forefront of every decision
• User Experience Design – overall quality of a user’s interaction with a product

• UI/UX Explained In 8 Minutes | UI/UX Design For Beginners | UI/UX Design Basics | Simplilear
• Changing Experiences through Empathy – The Adventure Series
• https://careerbootcamps.gonzaga.edu/blog/ui-ux-design/12-ux-design-ted-talks/
• Smashing UX Design—Foundations for Designing Online User Experiences by Jesmond Allen and James Chudley

Thanks to the Women In Engineering (WIE) and its members who created this hands-on activity.

• Carolyn SherDeCusatis