Brighton School: Web Design Phase 1

Assignment:

screenshot from the teacher's website

screenshot from the teacher’s website

Today was the first day of website design and production class. I don’t know if there’s an official class name and to confuse it a little, it’s a split class where both sections take turns with the teachers and so this session is split with Marc for his business class. I’m opting for option 1 track 2 and build a responsive website with working homepage and designs (and mock-ups in photoshop) for 2 sub-pages for my branding project from last quarter, Brighton School.

Current solution for Brighton School's Website

Current solution for Brighton School’s Website

Phase 1 of Web Design

1. structure information with user-centered considerations (Site Map) *Research the competitors (Links) and content (html)

Brighton School | Private Preschool Through 8th Grade. I have started my Wordpress build. I’m going to continue to gather content. I’m using wordpress because this site is going to need up to date posts for community events and mentions in the press, etc. WordPress offers an easy to use interface that the client can use to update and add new information.

site map v.1

site map v.1

Holy Rosary School | Homepage.
Bright Water School | A Waldorf School in Seattle, WA.
The Bush School, a K-12 independent, coeducational day school in Seattle, Washington.
Lakeside School – an independent school in Seattle, WA. (I like this one especially)
Westside School | Westside School.

2. communicate style and function Branding (style Tile) Version 1, very basic. Typography not fully solved, though I really like this Noto Sans.

sty-ti

3.wire-framing explore more efficient layouts (Don’t forget Advertisements if necessary!)

See Brighton School: Wireframes | Katablog.

4. understand mobile strategy and other media requirements Client wants 3 layouts– mobile, tablet (landscape), and desktop. I think that teachers’ tool is the tablet. Great for on the go teaching, taking attendance, I think it would be a nice thing for the teachers to look at the website on their tablets and have a great experience.

3 layouts responsive

5. Users: audience, demographic. Who is this for? How should that influence the website? I realized that I wanted the website to appeal to the students at the school as well as the teacher. A school. It’s an organization for kids after all. So I’m looking at media that relates to that demographic and taking visual cues.

PBS KIDS: Educational Games, Videos and Activities For Kids!.

Links:

siteInspire – Web Design Inspiration.
GuideGuide.

Advertisements

About KC

I am Katarina Countiss, a multimedia designer. I like blogs, games, art and technology. I am curious about how things are made.
This entry was posted in Web Design. Bookmark the permalink.

3 Responses to Brighton School: Web Design Phase 1

  1. Pingback: Brighton School: Wireframes | Katablog

  2. Hey There. I found your blog using msn. This is a very well written article.
    I’ll be sure to bookmark it and come back to read more of your useful info.
    Thanks for the post. I’ll definitely return.

  3. stuff says:

    Hi, yes this paragraph is truly nice and I have learned lot of things from it about blogging.

    thanks.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s