This assignment has 3 parts: creating a sitemap, wireframing, and conducting interviews. The purpose of the assignment is to prompt you to think about and plan the hierarchy of information on your website and to distribute the content of your website in a clear and logical manner having in mind an average user. This stage of your project will allow you to identify and address any potential problems before you start building the website.

1. Create a sitemap based on your research paper using one of the tools listed below. Upload an active link or a PDF of your site map on Bb.

Read:

McCoy, Julia. “10 Tips for Writing High Quality, Engaging Website Copy.” CEO.com (blog). September 10, 2014. https://www.seo.com/blog/10-tips-for-writing-high-quality-engaging-website-copy/

The Jimdo Blog for Entrepreneurs. “The 11 Golden Rules of Writing Content for Your Website.” May 12, 2015. https://www.jimdo.com/blog/11-golden-rules-of-writing-website-content/

free tools:
GlooMaps
MindMeister

free trial:*
Balsamiq
Moqups
Axure
Slickplan
Writemaps
MindNode

If you are familiar with Adobe Creative Suite, you may use any Adobe program that you find suitable.

 

2. Create a wireframe of at least 2 pages of your website and upload the PDFs or active links on Bb.

To ease the wireframing process, you may want to preview the WordPress theme you selected on March 12. You may also use Wirify, which enables you to see a “wireframe-d” version of any live site. It is up to you whether you want to create high or low fidelity wireframes and choose your tools accordingly.

To access the wireframing tools, read these articles:

* Anderson, Kelsie.”7 Free and Open Source Wireframe Tools to Optimize User Experience.” IT Management. June 14, 2018. https://blog.capterra.com/free-and-open-source-wireframe-tools/

*Mockplus. “5 Free Quick Wireframe Tools For UI/UX Designers in 2017.” https://www.mockplus.com/blog/post/free-quick-wireframe-tools

* Justinmind. “What’s the difference between low fidelity and high fidelity wireframes? Exploring the prototyping fidelity spectrum in the web and mobile design process.” December 22, 2017. https://www.justinmind.com/blog/low-fidelity-vs-high-fidelity-wireframing-is-paper-dead/

* You are not required to purchase any of the features offered by the site mapping tools listed above. Use free trials. If you are familiar with Adobe Creative Suite, you may use any Adobe program to execute this assignment. Using Adobe Creative Suite is recommended but not required in this course.

 

3. As you create your sitemap and wireframes of your pages, interview at least 5 classmates, friends, or family members to test whether your way of distributing information resonates with an average user.

Make adjustments based on the feedback you receive from the interviews. For help with the interviews, read this post:

Teixeira, Fabricio. “Asking the right questions during user research, interviews and testing.” UX Collective. March 20, 2017.https://uxdesign.cc/asking-the-right-questions-on-user-research-interviews-and-testing-427261742a67

NOTE

At this point in the semester, you should be familiar with wireframes and sitemaps. If you find it necessary, you may review the basics here:

Cardello, Jeff. “The modern web design process: creating sitemaps and wireframes.” Webflow (blog). August 22, 2017. https://webflow.com/blog/the-modern-web-design-process-creating-sitemaps-and-wireframes

Lin, Winnie. “A Beginner’s Guide to Wireframing.” Webdesign.tutplus.com. 18 Jun 2012. https://webdesign.tutsplus.com/articles/a-beginners-guide-to-wireframing–webdesign-7399

 

---