Wug Interactive Poetry Website, Information Architecture 2014

wug
Joseph Olivarez, Lizzie Seiple,
Madeleine Guy, & Pearl Ko
Information Architecture, Fall 2014

Table of Contents
I. Vision Statement p. 3
II. Competitive Analysis p. 5
III. User Personas p. 8
IV. Conceptual Framework p. 14
V. Userflows p. 15
VI. Wireframes p. 19
VII. Usability Testing p. 32
VIII. Appendix p. 39
A. User Survey
B. Competitive Analysis

I. Vision Statement
Wug is a new social and interactive
website that lets you create, curate, and
explore the world of poetry online.
Wug takes traditional poetry to a more interactive
level, engaging users of all ages and creating a
more exciting atmosphere for learning poetry than
is currently available on the internet.
We tried to achieve this goal by incorporating user-
created visual and audio media into the website.
Not only can a user find and read a poem on Wug,
but they can also record themselves reciting it and
create a video or image to go along with it. This is
published to the site and becomes searchable, just
like a video posted on Youtube. A user can also
publish and record original poems on the site as
well.

II. Competitive Analysis
For a table of our full findings, see Appendix B.
We performed a competitive analysis to determine the best information architecture and design practices
in children’s and poetry websites. We examined five websites: poetryfoundation.org, gigglepoetry.com,
poetry4kids.com, kids.nationalgeographic.com, and pbskids.org.
We sought to answer the following questions:
1. What are effective browsing functions for children?
2. How can browsing be made easier and/or more fun for children?
3. How can searching be made more appealing for children?
4. How should search results be displayed?
5. Are there unconventional, alternative linking or exploratory features?
6. How can children be encouraged to explore and interact with content?
7. What is the most visually appealing design for children (colors, menus, shapes, etc.)?
8. How should users be able to submit and curate content?
9. Lastly, what should a parents and/or teachers guide include?

II. Competitive Analysis: Summary of Findings
Browsing & Navigation
▰ PBS kids and National Geographic Kids offered child-
friendly browsing methods: a “roulette wheel” and
continuous scrolling, respectively.
▰ The navigation system of the Poetry4Kids site had a
crowded layout and distracting background.
Search
▰ PBS Kids and Giggle Poetry did not offer a search
function.
▰ The search refinements from Poetry Foundation may
not have been child-friendly, and the search engine
of Poetry4Kids was imported directly from Google.
Interaction
▰ The Giggle Poetry site offered an interactive rating
system and randomization feature
▰ PBS Kids offered games and the option to save users’
progress and scores.
Visual Design
▰ Our research suggested children prefer colorful,
large, uncrowded layouts, and the most successful
websites such as PBS Kids and National Geographic
adhered to these recommendations.
User Content
▰ The PBS Kids site highly facilitates the creation and
sharing of user content through writing contests and
games.
▰ Similarly, National Geographic Kids sponsors user
photo contests.
Parent & Teacher Resources
▰ PBS Kids offered a parent and teachers portal with
resources.
▰ Giggle Poetry offered teaching resources, but they
were designed for children to teach poetry to
themselves.

Linnea Gonzales
Fifth-Grade Girl
Anna Askaryan
Fifteen-Year-Old Student
Felix Gordon
Middle School English
Teacher
III. User Personas
Personas helped us to imagine the range of motivations behind visiting our site and what sort
of challenges might be presented by different age groups.

III. User Personas
Each persona contributed to our conception and design of the website in important ways.
Linnea Gonzales, the fifth-grade girl, made us think seriously about the limitations of creating a
traditional poetry website for children. We originally planned to make Wug usable for kids as young
as six, but Linnea is ten and is still too young to be a competent speller, is not tech-savvy, and
doesn’t read that much yet. Essentially, she showed us that, although some young kids might
enjoy and be able to use the site, realistically the youngest user-base we could hope for would be
closer to a teenager, like Anna Askaryan.
Anna Askaryan became our model for a general teenage user of the site. She already has an
interest in poetry, has a fair comfort level with technology and Web 2.0, and wants to find a social
and creative outlet. In particular, Anna’s familiarity with sites like tumblr enabled us to make a site
that relies on popular design idioms, such as a tiled grid layout, user profiles, liking, and list-
making, etc.
Felix Gordon’s persona informed our design of the teaching resources page.

Linnea Gonzales
Fifth-Grade Girl
Goals: Become a better singer.
Meet other kids who like to write
lyrics.
Challenges: Doesn’t know much
about poetry yet. Spelling and
vocabulary limited.
Tech Ability: Minimal
Linnea Gonzales is in the fifth grade. She isn’t a bookworm
but she does well in school. Somewhat popular, she
follows all the trends in music, fashion, and TV and
movies. She is a good singer, and her interest in
developing this talent is pushing her to learn more about
the arts. She likes the songwriting of Alicia Keys and Adele.
Linnea has two older brothers, and the oldest one,
Sebastian, owns a laptop. The younger one, Joaquin, owns
a tablet. At Linnea’s insistence Sebastian and Joaquin have
shown her how to play videogames on their devices, and
she has learned typing and other basic computer skills at
school. The websites she is most familiar with are Google,
YouTube, Facebook, and CoolMathGames.

Linnea Gonzales: Scenarios
▰ Assignment from teacher
Linnea’s teacher gives her class a two-part assignment for using Wug. First, the
students must find several different renditions of Langston Hughes’ Harlem and
choose their favorite. Second, they must each find a poem they like, record themselves
reading it, and choose an appropriate picture to go along with it. What IA will make
this assignment the most straight-forward?
▰ Link from Facebook
A boy from Linnea’s school posts his video and recording of Ladies First by Shel
Silverstein on Facebook. Linnea clicks through to land at the boy’s profile page on
Wug. He only has the one poem recording up there so far. What IA will make this
empty profile page pull Linnea in and prompt her to explore the site?
▰ Actually just interested in poetry
Linnea has written some lyrics for songs and wants to share them, receive feedback
(praise), and find other kids writing similar stuff. What IA will help her find like-minded
people?

Anna Askaryan
Fifteen-Year-Old Student
Goals: Become more popular and
confident, make more friends.
Find an outlet for creative
expression.
Challenges: Shy, lack of
confidence. Procrastinator.
Tech Ability: Fair to good, but
lacks advanced resources
Anna Askaryan is a fifteen-year-old girl from Glendale,
California. She is the middle child of Grigor and Irina Askaryan,
Russian-Armenian mathematicians now running a busy
delicatessen. Her siblings include older sister Taline (seventeen)
and younger brother Levon (ten).
Anna is shy, sweet-tempered, and attracted to sad-and-morbid
things. She is very close to her family and, apart from besties
Daniel and Yasmin, does not have many friends. Anna attends a
math-science magnet school where she is an average student
and dislikes almost every class except Music and English. She is
sometimes lonely, and, while the sisters are fond of each other,
Anna is jealous of the attention her parents give Taline--a
popular and ambitious honors student on the fast-track to cure
cancer. Anna is close to her grandfather, Petros, who has always
encouraged her to read and express herself through writing.
Between helping her parents run the delicatessen, watching
over little brother Levon (rough and tumble, mischievous), violin
practice, and finishing homework at the last minute, Anna does
not have much free time. But when she has a moment, she
enjoys reading, being with friends, and watching movies. She is
active on tumblr, which she checks on her iPhone. She has a
laptop PC for school and general use.
Wants: Easy-to-use responsive/mobile interface with social and
sharing features. Welcoming online environment that
encourages expression and creativity.

Felix Gordon
Middle School English Teacher
Goals: Provide students an
environment to express
themselves. Develop a poetry
curriculum for skeptical children.
Challenges: Students can be
difficult, easily distracted, Limited
budget, resources, time.
Tech Ability: Not great but willing
to learn
Felix Gordon is an English teacher at a public middle school in
the south side of Chicago, Illinois. He is married to Rebecca
Pham, an illustrator, and together they have an eight-year-old
son named Lewis.
Felix is a hardworking teacher and fierce advocate of the
humanities in public school curricula. He teaches English to
grades six, seven, and eight, and many of his students are
disadvantaged and at-risk youth. Currently, Felix is working
with two other teachers to develop a poetry curriculum for an
after-school writing workshop. He believes that creating a safe
and positive environment for children to express themselves
is key to successful individual growth. In regular lessons, Felix
regularly incorporates various media forms, such as music
and visual arts, to engage his students, and he hopes to
extend this to the workshop.
Felix is under tight budget and time constraints--there is one
desktop PC in his classroom and the school’s library has only a
handful of sorely outdated machines. But Felix is eager to
seek out alternative teaching resources that would offer more
than just reading materials; he wants to draw attention to
poetry by women and people of color, and to introduce the
interactive and performative aspects of poetry to his students.
Wants: Teaching resources that emphasize the performative
and multi-media possibilities of poetry. Lesson plans, videos
tailored by grade level, print-outs, and suggested activities for
students.

IV. Conceptual Framework: “The Vortex”
This diagram shows the available user actions for different types of content, and how these can
be categorized into two levels of user behavior.
▰ PRIMARY LEVEL: Searching, consuming
▱ Casual unregistered users
▱ Three access points for discovering
poetry content: videos, poem
text/pages, and the user community.
▱ Access points encourage investment in
the site, e.g. signing up as member to
like videos and poems, make lists,
follow other users, etc.
▰ SECONDARY LEVEL: Participating, creating
▱ Registered users
▱ Unlocks creation & curatorial site
functions, plus primary functions.
User-created content then becomes
discoverable by other users.

V. Userflow
We created a userflow to map the conceptual framework to user navigation and interactions.
The three main paths are: Browse, Create, and Curate

VI. Wireframes
We used Balsamiq Mockups for rapid prototyping. More details in the pages to follow.

Homepage
The landing page for registered and non-
registered users alike. Recommended content
changes to reflect user’s logged-in status.
▰ Universal Navigation - Because our website
relies on a recommender system to direct users
to content, we chose to keep our universal
navigation minimal and unobtrusive, including
only the essential actions on the site (curate,
create, browse/explore) and a search bar.
▰ Teaching Resources - Link to resources for
teachers and parents. In order to make this
portal accessible but separate, we kept it out
of the universal navigation, but only a click away
on the homepage.
▰ Featured Content - We wanted to include staff-
curated content (e.g. “Jay-Z reads Emily
Dickinson”), but this is atypical of recommender
sites like Pinterest. Our solution: link it to an
external blog so that it is available if users want
it, but it doesn’t "invade" the website or require
inclusion in the universal navigation.

Teaching Resources
A separate page from the
main content with resources
for teachers and parents.
Inspired by user persona Felix
Gordon: someone who needs the
site content but would not
necessarily be generating any of
his own.
Lesson plans, videos which are
tailored by grade level, print-
outs, and suggested activities
for students.
Homepage features a link to this
page which is noticeable, but
not distracting.

Browse
Browsing and searching are
essential functions of the site.
They are the only links to the
main content.
Clicking ‘Explore’ in the top nav bar
leads to a browse page where
poems, videos, and users are
displayed across three horizontal
scrolling carousels.
Narrow results by clicking ‘refine
your search!’ in the upper left
corner, which expands into an
accordion menu of refinement
categories.

Search
Search is accessible at all times
via the universal navigation. It
features the same interface as
the browse page.
The user can perform a
keyword search and narrow
results with the refine your
search! option.

refine your search!
To aid browsing and encourage
exploration, we created a
refinements bar that echoes
the hierarchy on the Poetry
Foundation's browse page.
Refining enables more accurate
searching and helps the user
articulate what kind of poetry
she seeks, which further
encourages exploration.
In addition to conventional
categories like Subject and
School/Period, we also offer
alternative categories, such as
Tone/Emotion and Color.

Poem Page
A clear and uncluttered poem reading interface with links to
other content to stimulate exploration, creation, and
curation.
Clicking a poem from the browse or search results page takes the user
to a poem page. Read the poem, add it to a list, “like” it, or share it
on a social media site with the buttons above the title.
Related content sits at the bottom of the page to minimize distraction
from reading, but it is still difficult to overlook.
Video, Play Button, and Ellipsis icons reduce the visual clutter of
labeling the content categories (i.e. "Videos for the same poem",
"Similar videos of other poems"). Mousing over the icons will produce
their labels.
record this poem! will activate the creation interface with which users
can make recordings.
Tags display all categories related to this poem, enabling browsing, e.g.
clicking “funny” tag will display results for all poems with the same tag.

Viewing Interface
Clicking on a video from the poem page prompts
a modal viewing interface to appear. This
displays the video or slideshow, along with poem
title and author name, and the name of the user
who made the recording (denoted by microphone
icon). We chose this interface because it allows
the user to view the content while staying
anchored in the original poem page.
Poem text is also displayed in a scrolling area for
reading along.
From here, the user can also “like”, add the poem
to a list, or share it using the buttons below the
text area.

Creation Interface
On every poem page there is a record this poem! button. If
the user is logged in, clicking this button will prompt a
creation interface to appear as a modal dialogue box.
From here, the user has five action options: record, upload, edit,
save, and publish.
▰ Scrollable poem text area enables easy reading along.
▰ Asset library where users can store and manage their
uploads, and also use stock media if they choose to.
▰ And the main editing section has drag-and-drop
functionality for quick media rearrangement.
Once the user hits publish she'll be met with a confirmation
dialogue and the options to return to the poem page or view the
video on her profile.

User Profile
The user profile serves as a hub
for curatorial actions: viewing
and managing recordings, liked
content, lists, and friends.
Username, avatar, and social media links.
Beneath these are four buttons that
switch between content views.
Content is displayed in a tiled grid layout
by default. This can be changed to a listview
using the view-switcher buttons in the
upper right next to sorting drop-down
menu.

Lists View
By clicking on the lists icon, users can create new lists
and edit existing ones.
Clicking on the pencil icon next to a list name will
prompt another modal dialogue box that allows the
user to rename the list, delete it, edit the
description, and rearrange list items.

List Editing Interface
A simple and powerful set of editing tools
to maximize curatorial control over a user’s
lists.
The following actions are available in the list editing
interface:
▰ Rename or delete list
▰ Edit description
▰ Change cover image
▰ Reorder list items by dragging, move to a
different list, or delete

Poet Page
We created poet pages in order to make
an easily-incorporated space to display all
of a poet’s poems, which is not possible
from the browse, search, or poem pages.
Poet pages are accessible by clicking on an
author’s name, e.g. on a poem page or a
video, etc. Here, users can:
▰ Become a fan of the poet
▰ Explore related tags
▰ Browse works by the author
▰ Browse recordings of author’s works
▰ Browse other fans of the author
Content is also displayed in a similar grid
layout to the user profile.

VII. Usability Test: Plan
Objectives
Validate general navigability of site for main user actions (e.g. search, create content, curate content, and
socialize). Validate clarity of labeling across pages.
Evaluator
Philip Jesse Bertron-Lowe aka “JB”. Besides being a poet and avid reader of poetry, JB is a middle-school English teacher and
also organizes the Round Top Poetry Festival every year.
Methods
Cognitive walkthrough and think-aloud evaluation with paper prototypes of wireframes. Survey questions for distribution to
evaluator’s middle-school class, but they were not implemented. See Appendix for full list of survey questions.
Scenarios
1. Look for a new poem to use for your poetry class.
2. Locate a specific poem, find a video for it, find a similar video.
3. Get suggestions and lesson plans for teaching poetry.
4. Add a poem to a list.
5. Create a list, title it, add a cover picture for it, add poems to it.
6. Delete an item from a list.
7. Follow a friend.
8. Make a recording of a poem.
9. Find a list of all of a poet’s poems.

What Worked
✓ Browsing and searching for poems was
straightforward.
✓ Poem page was easy to understand.
✓ Viewing interface was unproblematic.
✓ Teacher resources contained desired
lesson plans and videos.
✓ BONUS: JB loved the markup (sticky
notes) accidentally left in our Balsamiq
mockups. He said they were helpful for a
first-time user of the site.
Usability Test: Results
Our evaluator successfully completed all of the tasks, however there were several problem
areas. Below is an overview of our observations. We discuss the problem areas and the
questions they introduced in the following pages.
Problem Areas
✗ Scenario 3, Search results. Relationship between users
displayed and the search terms is unclear.
✗ Scenario 3, User profile. What is the default view?
✗ Scenario 5, Create. Labeling problem, thought "Create" in
top nav bar was for creating a list.
✗ Scenario 5, List editing interface. Unclear how to add a
video to a list.
✗ Scenario 8, Creation interface. Overwhelmed by options.
Labeling problem with the tabs of the asset manager.
Recording interface unclear.

Scenario 3, Search Results
For Scenario 3, JB was asked to find more
videos and teaching materials for his class. He
began by searching for “epistolary poems” in
the search bar.
On the results page, he expressed confusion
about the user avatars displayed in the bottom row
of the search results. What is the relationship
between the users displayed on the results
page and the search term(s)?
Although this was not a major stumbling block, it
prompted a discussion: Can users explicitly enter
or select their interests for searchability? Or are
these interests determined by the lists they create
or by their “liking” behavior?

Scenario 3, User Profile
From the search results page in Scenario 3, JB
clicked on a user avatar to see what they might
have on their profile. In his words: “Well, let’s say
I didn’t find what I wanted on the search results.
Maybe this person will have something.”
On the user profile, JB wanted to know about the
displayed content there (the paper prototype displayed
the user’s likes by default). Again, this was not an
obstacle to the task, but another point of discussion:
What is the default view of the user profile? A user’s
poems, likes, lists, or friends? Is this area
customizable?
After surveying the user profile and not finding what he
wanted, JB returned to the homepage. From there he
successfully found the Teaching Resources page and the
lesson plans he wanted.

Scenario 5, Create
For this scenario, JB was asked to create a new
list of poems, title it, add a cover picture for it,
and add poems to it. From the Teaching
Resources page, JB clicked the “Create” button
in the top navigation bar.
▰ Labeling problem: The “Create” button
prompts the creation interface to appear--
for making new recordings, not for making
new lists.
JB closed the creation interface, returning to the
Teaching Resources page. He then proceeded to
his user profile by clicking the “You” button in the
top navigation bar.

Scenario 5, List editing interface
On the user profile, JB navigated to the lists view.
He clicked “create new list” and successfully
interpreted the functions of the editing icons.
However, JB expressed confusion about how to
add a new video to the list.
This was a major problem area. The list editing
interface lacked functionality for adding new items.
We discussed solutions, considering Youtube and
Pinterest as examples of best practice:
▰ Youtube’s answer: A drop-down search area to
add videos to the list; this might possibly
overburden the interface.
▰ Pinterest’s answer: Adding to lists exclusively
from poem pages; but it seemed unintuitive to
be unable to add items while on the list-editing
interface.
Ultimately, JB could not complete the task of adding a
poem to the list via the editing interface, but he was
able to add to the list from the poem page.

Scenario 8, Creation interface
For this scenario, JB was asked to make a recording of a
poem. He clicked the “Create” button in the top nav bar,
prompting the creation interface to appear.
At first, JB seemed to be overwhelmed by the options.
He hovered over the functions for a time before
consulting the asset manager on the right side of the
interface.
▰ Labeling problem: It was unclear what the tab
labels of the asset manager were meant to
indicate. Not an obstacle but confusing.
▰ The recording functions at the bottom of the
interface were somewhat unclear. They did not
communicate how recording would actually
work.
▰ Importing poem text from a different page into
the interface was also not obvious (the paper
prototype has a poem loaded in by default).
As a positive, JB was very enthusiastic about the leftover
markup (sticky notes) in the Balsamiq screenshots. He
found them to be very helpful, especially as a first-
time user of the site.

Appendix A: User Survey
Age:
Gender:
Grade:
1. Do you own a smartphone? (Y/N)
2. What are the websites you visit most often? Please name your top three, but feel free
to list as many additional ones as you like.
3. Do you like poetry? (circle one) Feel free to explain. (Yes / kind of / maybe / no / I don’t
know) Explanation:
4. Do you ever read or look up poetry on the internet, either for school or for fun? (Circle
one) If yes, what websites do you use for this purpose? (Y/N)
Websites:
5 a. Do you write your own poetry? If yes, please answer questions 5 b through 5 e, as
well. (Y/N)
5 b. Do you write poetry for school, for fun, or for both?
5 c. Do you ever share your poetry with your friends or family? (Y/N)
5 d. Have you ever shared, posted, or published a poem online? (circle
one) This can include any poems you have put on Facebook, tumblr,
twitter, or other social media. If yes, please tell us a little about your
experience (What website did you post it on? Did you receive positive
feedback? Was it a good experience?)
(Y/N; Explain)
(Not likely / somewhat likely/ very likely)
5 e. If a website existed for sharing your own poetry and reading others’
poetry, how likely would you be to use it?
6. If you could listen to a poem being recited while you read it, do you
think this would make the poem less interesting to you, more interesting
to you, or about the same?
(less interesting/ more interesting / about the same)
7. If you could watch a video to go along with the poem while you read or
listen to it, do you think this would make the poem less interesting to you,
more interesting to you, or about the same?
(less interesting/ more interesting / about the same)
This concludes the survey! Thank you so much for your help!

Criteria poetryfoundation.org gigglepoetry.com poetry4kids.com
kids.nationalgeo
graphic.com pbskids.org
Browsing
Browsing within tertiary
navigation. Small browsing
feature with icons and
small text on right hand
side.
Browsing by icons,
rating function, and
randomization
feature.
Browsing categories
useful but poorly
designed. Small icons
accompany each
poem.
Browsing by colorful
images with large text
in continuous scroll.
Also by Previous &
Next buttons.
Browsing by roulette
wheel, icons and
images. Categories of
games are by topic,
TV show, and
difficulty level.
Search
Search bar in upper-left-
hand corner with icon.
Search refinements not
child-friendly. Search
results offer preview of
poem’s first lines.
No search function. Search engine
imported from
Google. Smallness
and uniformity of text
not child-friendly.
Prominent search bar
in upper-left-hand
corner with icon.
Search results are
text only but are
colorful and in large
print.
No search function.
Navigation
Top navigation uniform
across site. Navigation also
through small text site
index at bottom. Not child-
friendly.
Top navigation leads
to commercial sites.
Left-hand sidebar
navigation is colorful
with large text.
Navigation items are
crowded and in small
text. Accompanying
icons are small.
Navigation dropdown
menu from “GO”
button offers large
text icons and list of
popular items. FAQ,
About Us, and Privacy
Policy are small (but
this could be
considered child-
friendly).
Top navigation offers
“Apps,” “Shop,” “Help,”
etc. Browsing by
images is primary
form of navigation.
Appendix B: Competitive Analysis Table

Criteria poetryfoundation.org gigglepoetry.com poetry4kids.com
kids.nationalgeo
graphic.com pbskids.org
Interactivity &
Visual Design
Site is designed in
professional, adult colors and
text and is not child-friendly.
Only interactive elements are
standard highlighting when
hovering over a link.
Site is designed in child-
friendly colors and large
text, but layout remains
chaotic. Interactive
elements are standard
link highlighting and the
rating feature.
Site is designed with
small text and crowded
visual elements.
Interactive elements are
standard link
highlighting, a rating
feature, and comments
section.
Site is designed in very
child-friendly large text,
colorful sections and
prominent images.
standard link
highlighting and
highlighted icons and
features.
Site is designed in child-
friendly large text and
colorful sections, with
prominent images.
standard link
highlighting,
animated Flash items
which move when
hovered over, and
roulette browsing
wheel.
Parent &
Teacher
Resources
Resources offered in top
navigation bar and site index
are not necessarily tailored for
parents & teachers.
Poetry Teachers option
in top navigation leads
to external site. Poetry
Class section in sidebar
is designed for children
to teach themselves
poetry.
For Parents and
Teachers are options in
sidebar. For Parents
leads to a blank page,
For Teachers leads to an
article with suggestions
for a classroom visit by
poetry authors.
No Parents or Teachers
option offered on home
page. When any link is
followed, an Education
Guide is one of many
links in the bottom site
index.
Upper-right-hand corner
features prominent
Parents link. This offers
links to teaching
resources, school
readiness programs,
and a PBS Parents
website.
User Connection
& Content
Users are offered My Favorite
Poetry option, but nothing
tailored for children and no
user content is featured.
Users may sign up for a
newsletter but no other
connection options
offered. No user content
is featured.
Users may create an
account and subscribe
to weekly or monthly
listservs. User
comments are featured
in right-hand sidebar
and below poems.
User photos are
featured on homepage
and MyShot section.
Users are given “badges”
for participating. Users
may become members
and sign in to
personalize their
content. Users are
encouraged to vote in
polls.
Users may sign in to
save their games and
scores. User content is
not featured.

Wug Interactive Poetry Website, Information Architecture 2014

Recommended

Recommended

More Related Content

Similar to Wug Interactive Poetry Website, Information Architecture 2014

Similar to Wug Interactive Poetry Website, Information Architecture 2014 (20)

Recently uploaded

Recently uploaded (20)

Wug Interactive Poetry Website, Information Architecture 2014