← View sitemap
Housing Options Scotland

Website wireframes

The page templates for your new site, first draft. Each one shows the shape of the page in plain grey boxes, no real words or pictures yet. Hover the little ? on any row and it explains, in normal language, what that part of the page is for. Best place to start is the sitemap, for the overall picture.

View the sitemap →Open the homepage
A couple of things to know
?Hover the ? on any row to see, in plain words, what that part of the page is for
OptionalBits we can switch on or off, page by page
01
Wireframe ready

Homepage

The front door. A friendlier welcome, a quick 'what do you need' start, your services, your impact, the latest, and help at the end.

View wireframe
02
Wireframe ready

Section landing

One flexible page we reuse for About us, How we can help, Our services and Support us. A welcome, then cards pointing to everything underneath.

View wireframe
03
Wireframe ready

Service page

The big new one, built around what people actually want to know. It powers Making Moves, Military Matters, Hospital Housing Clinic and Coming Home.

View wireframe
04
Wireframe ready

Get help (triage)

A warm, one-click start instead of a cold form. It sends people to the right place and sets expectations before your Tay Fusion form.

View wireframe
05
Wireframe ready

Refer someone

The route for professionals that people couldn't find before. Who can refer, when, what's needed, and what happens next.

View wireframe
06
Wireframe ready

Inner page

The everyday page you'll use most, with a handy sidebar. Vision and values, How we work, your Research hub, Funders and the legal bits.

View wireframe
07
Wireframe ready

Our people

Staff and board profiles. A short hello, then a friendly grid of people split into Team and Board.

View wireframe
08
Wireframe ready

News listing

All your news in one filterable grid, with type labels (blogs, interviews, research, client stories, podcasts, events) and a sign-up.

View wireframe
09
Wireframe ready

News / client story

A single post: title, opening line, an optional photo, an easy-to-read body, and a few related posts. Also your client stories.

View wireframe
10
Wireframe ready

Contact

A friendly Get Help pointer first, then a smart enquiry form with your details and a map. It guides people to the right place.

View wireframe
11
Wireframe ready

Donate

A heartfelt case for giving, with real examples of what a gift does and a DonorBox box for one-off or regular donations.

View wireframe
A quick word on this set

Eleven templates cover the whole site. Section landing is reused for About us, How we can help, Our services and Support us. Service page is the big new one, built around what people told us they actually want to know, and it powers Making Moves, Military Matters, Hospital Housing Clinic and Coming Home. Get help swaps the cold form for a friendly, one-click start, and Refer someone is the route for professionals that people just couldn’t find before.

Your Get Help form stays exactly where it is, with Tay Fusion. We’re just giving it the new look. These are greyscale on purpose; the colour, photos and proper type all come in the design stage. The floating Pages tab on the right lets you hop between templates.

Design review

Jump between the wireframe templates here. The designed versions come in the next phase.