Upload
antti-tuppurainen
View
2.274
Download
4
Embed Size (px)
DESCRIPTION
Citation preview
VISION OF THE PROJECT RESULT
1
Welcome to the first glimpse of the new sitra.fi, this is our vision.
There’s more color, more visual data and all the existing content is accompanied by streams of live social media content.
In the following pages we proudly demonstrate how we will build a website that feeds users’ needs and transforms them into super users.
About the design
• Key elements of the design are the bold violet bar at the top and the large photographic banner overlaid with headline text and links.
• The main photographic element on the home page brings in warm tones to complement the violet of the main brand color.
• 3-4 emphasized site topics in the main color bar, with primary navigation following below.
• The layout is based on a grid system (960px wide, 12 columns), making it easy to expand while ensuring a consistent visual rhythm throughout the site.
• Full layout images for home page, sub page and search results page can be found in the last pages of this document. (pages 8 and 9)
AUCOR OY & SYNEUS OY
SITRA.FI DEVELOPMENT PROJECT
Esittely Ohjelmat TulevaisuustyöMitä ja kenelle
Julkaisutoiminta Ajankohtaista Viestintä Yhteystiedot
2
English Svenska Haku
AUCOR OY & SYNEUS OY
SITRA.FI DEVELOPMENT PROJECT
MAIN SECTIONS AND HOME PAGE
•Tiedotteet
•Tapahtumat
•Artikkelit ja puheenvuorot
•Logot ja kuvat
•Tapahtumat
•Tavoitteista totta
•Puheenvuorot
•Puheet ja esitysmateriaalit
•Seminaarit verkossa
•Tilaa tiedotteet ja uutiskirje
This diagram displays the relationships between the visual elements of the design and the logical sections of the site. The content of the home page, and the emphasis of certain content and navigational elements over others, are based on our vision of the most important parts of the Sitra site.
•Twitter, LinkedIn, Facebook
Simple sitemap inside footer
The 4th item in the topic bar can be a promoted section taken from deeper within the site.
= top subject menu
= primary navigation
Etusivu
HOME PAGE HOME PAGE WIREFRAME
AUCOR OY & SYNEUS OY
SITRA.FI DEVELOPMENT PROJECT
Subject navigation.
3
Sitra Lifestream(Social Media).
Primary navigation.
Footer with basic contact information and simplified sitemap.
Quicklinks to RSS feeds.
Quicklinks to programs.
Content
SUB PAGE SUB PAGE WIREFRAME
AUCOR OY & SYNEUS OY
SITRA.FI DEVELOPMENT PROJECT
Title & subtitle
Highlighted list element
4
Secondary navigation
Image with description text and source icon (flickr)
Breadcrumb trail
Footer with sitemap throughout the site
Content
Instant search suggestions on any page.
HOME PAGE FEATURES SEARCHING
AUCOR OY & SYNEUS OY
SITRA.FI DEVELOPMENT PROJECT
5
Original search terms displayed in a search field, making them easy to refine for another search.
Subject navigation opened by mouse hover.
Quicklink hover color is derived from the program it represents.
Filter search results by selecting a category.
Keyword highlighting with recognition of different word declensions.
Thumbnail images on results that contain relevant media.
Hyperlink colors for active, visited and normal links.
CONTENT MANAGEMENT
AUCOR OY & SYNEUS OY
SITRA.FI DEVELOPMENT PROJECT
6
Edit image screen
Images, video and audio are managed with Stardust Media Manager. The media manager can easily be integrated with various backends such as Sitra's MOSS media bank and Flickr.
MOBILE VERSION
If a mobile browser is detected, the user is prompted to choose between full and stripped down version of the site.
SPECIAL FEATURES
AUCOR OY & SYNEUS OY
SITRA.FI DEVELOPMENT PROJECT
7
MOTIVATING SITRA.FI USERS WITH REWARDS
Reward active users with badges, honorary titles or other credit.
Activity points can be collected by simply going through material on the site, commenting on articles and writing or validating content.
Each user can get points just by activating his/her profile page, and more would be given for e.g. uploading a profile picture (+10 points). Even more points could be earned through TOP-lists (see picture)
User motivating in action: Stack Overflow (http://stackoverflow.com/badges)
URL SHORTENER
DOCUMENT HIGHLIGHTING & SHARING
Experimental concept, highlight and share documents or blog articles within browser with save and share functions.
See Panic Inc.’s Coda Notes for Safari (http://www.panic.com/blog/2010/07/coda-notes-for-safari-now-available/) for similar and fully functional example.
Short links for Twitter and other social media sharing. Very convenient for sharing a link on paper or written by hand. E.g. the shortened version for
could be simply l.sitra.fi/dok25
See bit.ly or Syneus Solutions’ lyh.fi
www.sitra.fi/fi/Ohjelmat/suomen_elinvoiman_lahteet_kehitysohjelma_ohjelmat.htm
Demonstrated here are just a few concept ideas that we feel would lift the new sitra.fi user experience to a whole new level.
AUCOR OY & SYNEUS OY
SITRA.FI LAYOUT,
HOME PAGE AND SUB PAGE
8
AUCOR OY & SYNEUS OY
SITRA.FI LAYOUT,
SEARCH RESULTS
9
10AUCOR OY & SYNEUS OY
SITRA.FI DEVELOPMENT PROJECT
CEO Janne Jääskelä[email protected] 577 0215www.aucor.fi
CONTACT INFORMATION
CEO Ville Sää[email protected] 576 5828www.syneus.fi
AUCOR OY SYNEUS OY