Category: What I’m Building

What I’m Building: Art and Art History Redesign: Part 5 Project Management: Identifying and collecting content.

What I’m Building: Art and Art History Redesign: Part 5 Project Management: Identifying and collecting content.

I have been leading a project to redesign Seattle University’s Art and Art History Department webpages.  I must admit that I have fallen woefully behind in keeping up with posting about this project. I finished the project in October! Previously I have written about Identifying the objectives, developing the new IA, page layout, and elements and content.  With all the templates designed and built out, it became time to start collecting the assets and content.  


The very first step was to get organized.  I started by generating a large spreadsheet listing out each asset, or content piece that needed to be collected, written, or built. This master list would help me track all the individual items, build a timeline, and keep the team members apprised of our progress.  Once I identified all the pieces it was time to devise a timeline. We set the goal of having all of the content collected from the faculty by the end of a quarter, which gave us about 8 weeks to complete this phase of the project.  I divided the content into four groups: Degree pages content

  1. Degree Pages Content
  2. Student work Current student spotlights 
  3. Alumni spotlights and Classrooms and Galleries
  4. Innovative programs


At a Faculty Meeting I introduced the concept of a sprint, showed them the templates.  Although these talented individuals are experts in their fields, and have the greatest knowledge about the “product” aka the majors, they are not necessarily adept in writing for the web.  I directed each person to try to keep their paragraphs to 70 words and never over 120 and pointed them to the article writing for the web.  I created template document for each area (Visual Art, Photography, Art History, and Design) and gave them the current content from their site to get them started.  Finally, I included the reminder of the categories in the IA, indicating that they did not need to describe each program, but could link to further descriptions.  

On my end, I started tracking all the individual assets and where we were in the collection process. My spreadsheet started looking like this: 


For the most part this was a successful implementation.  I did get back the template from the individuals, and was able to track the pieces.  If I had this to do over, I would send more reminders to the faculty.  I had only sent a single email at the beginning of each sprint, and therefore some of the faculty forgot, or fell behind.  Some of them skipped ahead, and gave me items out of sequence, which meant I did not get a chance to dictate the format that I needed, and therefore had to spend extra time formatting or extracting content. 

Next Steps: 

Finishing up and going live! 

What I’m Building: Art and Art History Redesign: Part 4 Degree Page Elements and Content

What I’m Building: Art and Art History Redesign: Part 4 Degree Page Elements and Content

In my last post, I wrote about Initial Sketches and Page layout.  At this stage I will use our content management system’s “playground” to build each page offline and experiment with content types as solutions to the limitations and constraints. Once I have built each page, it will be a matter of migrating the content to the live pages.

One of the most important pages to design is the degree page.  As we have learned from our analytics analysis, our target audience navigates directly to degree pages from our search bar.  This means we need to pay careful attention to the language we use on our page for the best SEO.  We also need to include all of the elements that the university has mandated for inclusion on this page.

We will need to include:

  • a call to action,
  • the degree summary
  • program description
  • application information
  • learning outcomes
  • links to degree requirements
  • transfer information
  • ranking information

We have decided to include:

  • alumni testimonials
  • Department contact information
  • Link to the events calendar
  • Entrance requirements
  • Careers outcomes
  • Unique banner
  • 2 hero images

We may also include:

  • Additional opportunities
  • Study abroad
  • Honors
  • Specific course offerings
  • Internships
  • Exhibitions opportunities


The site has three zones: A (central), B (right) and C (Left). 

In our web layout and structure explorations, we have decided to eliminate left hand navigation and so we will be working with a layout that just included zones A and B.

After much experimentation, I will be using the following basic web structure:

Horizontal Navigation
Hero Image Call to action
Degree Description Degree Requirements
Secondary Image Program of Study
Secondary Description Alumni Testimonial
Learning Outcomes Ranking Information
Portfolio review information Contact Information
Technical/Equipment information Calendar of Events link
Emphasis/ Honors Information
Internships and Careers
Exhibition Information
Transfer Call to Action
Standard University Footer

Which once I chose the content items from the types available in our CMS, we have this as a basic structure:

Of course when we are optimizing this for mobile we are working with a single zone.  So our chart will look like this:

Horizontal Navigation
Call to action
Degree Requirements
Program of Study
Hero Image
Degree Description
Secondary Image
Secondary Description
Alumni Testimonial
Learning Outcomes
Portfolio review information
Technical/Equipment information
Emphasis/ Honors Information
Internships and Careers
Exhibition Information
Transfer Call to Action
Ranking Information
Contact Information
Calendar of Events link
Standard University Footer

I will use this basic pattern to create the photography, Digital Design, Art History, and Visual Art Degree pages. Standardizing this content will also serve another function.  Departmentally we have many content contributors, and this will allow us to standardize how we check for updates.  It will be easy to create a form that says: “Check your alumni quote, your primary content, images, and submit any updates to the web manager.”

Overall, I am pleased with this layout and I think we are going to have an exciting page that informs our target audience.

Next steps:

Project Management: Identifying and collecting content, teaching others how to write for the web, introducing a sprint.

What I’m Building: Art & Art History- Part 3 Page Layout

What I’m Building: Art & Art History- Part 3 Page Layout

I recently led a redesign for the Art and Art History departmental web pages at Seattle University.  Previously I wrote about Identifying the Objectives, and The New IA.  My third step was designing the initial page layout.

My foremost design goal was to adhere to the identified objectives of:

  • navigation
  • redundancy
  • relevance


In the previous iteration of this site, the navigation and IA were limited by the structure, the content types available in the Content Management System, the university branding guidelines, and elements mandated to be included in particular places and on particular pages.  These limitations are still at play in the redesign although we will attempt to work with and around them when possible. Maintainability is a primary consideration, as there are staff and time constraints to keeping the information on these pages current. 

Design limitations will include:

  • Layout
  • Color
  • Content types
  • Content items
  • Branding guidelines

As determined in the restructuring of the IA, the new menu structure will be horizontal and fixed to six items:

Pages that need to be Built:

  • The Main department page: Art and Art History “splash page”
  • Degrees and Minors Page
    • Digital Design Degree Page
    • Art History Degree Page
    • Photography Degree Page
    • Visual Art Degree Page
    • Minor in Studio Art Page
    • Minor in Art History
  • Innovative Programs Page
  • Classrooms and Galleries Page
  • Alumni Page

As a personal preference, I usually start designing with a sharpie and paper, making quick outlines of elements and general placement.  In this particular case, these sketches were very important to illustrate to the web team where we were heading.

Art and Art History departmental “Splash Page”

This page serves an introduction to the department. The Department needs to keep the content current and fresh. This page is not as important as it would seem, most of the audience will not be searching for the department, but the degree pages.  Nevertheless, the page should be impactfull and needs to be representative of a dynamic and diverse department. 

I envision the department page as a carousal of rotating content highlighting; the faculty, gallery exhibitions, visiting artists, student features, events, and courses produced by the department. The page will also feature an overview of the department.  I will need to update the content quarterly.

Degrees and Minors Page:

This page will include the educational philosophy for the department, a mission statement so to speak, brief descriptions and hero images for each of the degrees offered and links to the degree pages.

This page is a provides a brief overview of each degree, serves as a landing page for prospective students who’d like to explore additional degrees offered by the department.

Individual Degree Pages Photography, Design, Art History, Visual Art

The Individual Degree pages are arguably the most important pages.  The university does do analytic tracking and has concluded that prospective student are landing at particular degree pages through the search bar.  This is the most important audience as prospective students are our customer base.

There are elements mandated for inclusion on this page. Including: a call to action, the degree summary, program description, application information, learning outcomes, links to degree requirements, etc.

My first inclination with these pages is to make them very similar to each other, this way the pages will be learnable, and maintainable.  This sketch will be the general degree page plan.

Faculty and Staff Page

Directory pages are straightforward, images and basic contact information.  This is a content type maintained at the college level, and it will just be a matter of including the banner, navigation and organizing into an understandable hierarchy.

Innovative Programs

The section we are titling innovative programs is a bit of a catchall.  It is a navigational summary, and a concentrate of content that in the past has contributed to the spread of the IA. It is also a way to introduce our audience to the breath of what we offer. The web committee went around in circles trying to name this section, before eventually landing on innovative programs.  It is a difficult thing to categorize partnerships, endowments, assistantships, internships, and residency programs into a single menu heading.

This page will have photos and descriptions in similar content blocks, with links were applicable, to standalone program pages.

Classrooms and Galleries

The Classrooms and Galleries page will have photos of the spaces and descriptions of what happens in those spaces.  In the case of the Galleries, there will be links to individual gallery pages. This seemingly simple page is vital to selling our prospective students on enrolling.  Students will need to imagine themselves in the space so dynamic photos and strong enticing descriptions will be imperative.

This page will have a list of spaces with links to content further down a long scroll page.

Student work

This page is a bit of a conundrum.  Ideally, this page will include work from students in each major, and likely will have a slideshow of images for each degree. The trick will be careful asset management to ensure swift load times. If multiple slideshows are not reasonable, I will explore alternative designs.


The Alumni page resolves to contain images and news features on departmental alumni.

Next steps:

Because this is a redesign of a site controlled by a content management system that has a “playground, instead of moving to design comps, I will begin to build each page offline and experiment with content type solutions. Once I have built each page, it will be a matter of migrating the content to the live pages.

What I’m Building: Art and Art History – part 2 the new IA

What I’m Building: Art and Art History – part 2 the new IA

I am in the process of leading redesign for the Art and Art History departmental web pages at Seattle University.  Previously I wrote about the first step in the process: Identifying the Objectives and concluded the redesign would focus on:

  • navigation
  • redundancy
  • relevance

I have since worked on restructuring the IA of the site so we have a solid plan, a map, of where we are heading.

Initial Structuring Brainstorm Meeting:

Because so many of the items on our site are constrained by convention.  I scheduled a meeting with our college’s Marketing Director.  I knew she would have a handle on the latest elements available in our content management system and would know which elements required by the college. We started our meeting with a discussion on the current structure of the site.

            Current Site Structure:

We talked in length about navigation and concluded the following:

  • From the analytics reports, we know that prospective students are accessing our degree pages through search.
  • Although we understand that the degrees are part of a department, which is part of a college, the target audience is not aware of that distinction. Our pages do not need to reflect the internal structure if it is not pertinent information to our customer base.
  • The department is unique compared to other departments in that the Art and Art History degree programs share resources, spaces, internship programs, and scholarships. We need to represent this without duplicating content in the subsections.

Simplifying the Structure

We started restructuring with a brainstorm session.  We pulled out the post-its and identified all the categories that are as standalone pages.  We grouped and revised as we found common features, and eliminated where we found unnecessary elements.

For instance, we found it unnecessary to have landing pages for Visual Art, Photography, Art History, etc, when we could instead structure everything from a departmental page with a common horizontal menu.  This would eliminate the need to include elements like scholarship, and facilities information under each degree page.  We decided forgo the inclusion of both “breadcrumbs” and left hand navigation, elements generated by the content management system, because they are reflective of internal structure and not relevant to our target audience.  When all was said and done, here was the initial plan:

This new streamlined structure eliminated about 50% of the pages we had previously maintained, going a long was to achieve our objectives of making the site easier to navigate and less redundant.

Navigation Build & Revisions:

Working with a CMS, can be restrictive.  After an initial structure build out of the pages and the navigation, I discovered that the navigation content type we chose is limited to six items.  This required us to combine categories strategically, resulting in our finalized IA structure:

I really enjoyed this process, it requires a lot of problem solving and reflection, but our blueprint is now complete and designing of the inital templates can begin.

Up Next;

Step Three: Content Design


What I’m Building: Art and Art History Redesign Part 1 Identifying Objectives

What I’m Building: Art and Art History Redesign Part 1 Identifying Objectives

Art and Art History Department Redesign

Step one: Identifying the objectives


I could start here by going into the history of this website, and the different iterations and content managements systems we have used during my tenure it my position, but that would be boring.  Suffice to say that the site has grown organically in the way a vine creeps up the side of a building, with branches all willy-nilly and far reaching without a structured plan. It’s time for some pruning.

Menu Navigation- Based on physical Location:

menu structure diagram


The Art and Art History Department pages encompass the department, four individual majors, two tracks of an interdisciplinary degree, and two minors.  There are three different main audiences- Current students, faculty and staff, and prospective students.  The University has declared designing for the “prospective student audience” the priority but the pages needs to work for current students and faculty as well because those are the high frequency users.

Although the art department considers itself special, and there are comparable examples of other institution’s art departments having a separate look and feel that that of the rest of the institution, we do not have that flexibility and will need to work within the Universities branding guidelines and content type library.  There are elements that will need to appear on every page, and standard components that will need to be included.

Additionally, there are structural constraints.  From an internal structural viewpoint, we consider all branches of the site to originate from the department, but the college, our hierarchal parent, separates things into undergraduate degrees and departments:

Internal structure

Internal structure diagram

Website structure

web site structure diagram

Internally this creates some problems because we have structured as if visitors are starting from our department page.  The navigation takes them away from the department and to the undergraduate degree pages.  The reasoning behind this structure stems from the fact that “prospective students” do not care which department houses their major, and I would agree with that as a statement, but a logical navigation structure is also paramount.  A structure that has users jumping sections without a clear way back does not follow best practices of usability.


This redesign will attempt to address three key issues: navigation, redundancy, and relevance.

Confusing navigation:

The current navigation is confusing. This is largely a structural issue, the requirements that individual degree pages live under “undergraduate degrees” and departments somewhere else causes navigation jumps between the department and the degree pages. For example when you navigate using a left hand menu from the department page to the degree page, the “breadcrumbs” do not match the path you took to navigate to the degree page:

SU Home College of Arts and Sciences/ Departments/ Art and Art History Department

Links you to this:

SU Home College of Arts and Sciences/ Undergraduate Degrees/ Art History

The inclusion of breadcrumbs should:

  • Show where you’re at, so you don’t feel lost
  • Show how a large, deep website is structured (or how products are organized)
  • Provide a way to get back a level to explore related content

Using breadcrumbs that do not adhere to these principles deteriorates the usability of the site, so our new design will address this issue with consistent menus.


The department does not have a dedicated content manager.  The vastness of the site needs to scaled back.  If there are pages that can be combined, they will be combined.  If there are pages that can be eliminated, we will eliminate.  When the site structure was originally determined, we were not yet designing for mobile platforms and much has changed.  The old observance of keeping information “above the fold” or keeping users from scrolling is outdated.  We will use long scrolling pages were appropriate.

While our content management system will allow us to mirror content, we will try to keep shared information in centralized locations. This will help with the ongoing task of updating content and keep the workload manageable for our staff.


One of the key tools we use to promote ourselves is not surprisingly our website.  Prospective students use our site to find out about our programs.  We are in need of creating interesting pieces of content that showcase our programs and inform prospective students what about our degree programs and department can offer.  We are after all trying to sell something. We need to replace our content with fresh images, current information, personal quotes and news.  Highlighting our unique programs and accomplishments in a maintainable manner is one of our chief intentions.

Next steps:

The department has formed a committee of faculty volunteers to aide in the completion of this redesign initiative.  To approach this project in the most effective manner we will need to start with developing the information architecture (IA).  I did have to do some explaining and persuading as the committee is most concerned with the look and feel of the pages.  However, if we start with a solid plan for the IA and identify the major content types that need we will have a solid base from which to build on.  I have scheduled a meeting with the college’s director of marketing to build out the new IA.

Up Next:

Step two: The new IA