Luis Andrei Agapito Computer 10 10/28/2020

Site map and Wireframe, Purpose of a Sitemap, How to make a

Wireframe.
Deadline: October 30, 2020
Filename Surname_2QT_Act1

Site map: A site map (or sitemap) is a list of pages of a web site within a
domain. Site maps used during the planning of a Web site by its
designers. Human-visible listings, typically hierarchical, of the pages on
a site. Structured listings intended for web crawlers such as search
engines. This is an example of a site map

Wireframe: A wireframe is a low-fidelity design layout that serves three

simple but exact purposes: It presents the information that will be
displayed on the page. It gives an outline of structure and layout of the
page. It conveys the overall direction and description of the user
interface. This is an example of wireframe.

This is an Facebook wireframe and as you see it’s a template.

2. How to make a Wireframe.

First things first. A wireframe is a low-fidelity design layout that serves
three simple but exact purposes:
It presents the information that will be displayed on the page
It gives an outline of structure and layout of the page
It conveys the overall direction and description of the user interface
Just like the blueprint of a building, a wireframe describes details clearly
and specifically while giving the builders (you, other designers,
developers, etc.) an overview of the project. Wireframes serve as a
middle ground between pen-and-paper sketches and your first prototype.
They help you plan the layout and interaction patterns of your users
without distracting details like colours or copy. The proposed user
journey should be clear without needing colour or shading or fancy
menus.

One of my favourite ways to see wireframes in action is to use the Wirify

bookmarklet1. Wirify lets you turn any web page into a wireframe in one
click, and it’s great for getting inspiration or guidance, especially when
you’re just starting out. Your drawing experience is completely
transformed when you hold down the alt/option key.