[Imc-alternatives] DESIGN: wireframing summary

Jay jay at fundamentalchange.net
Wed May 21 13:24:10 PDT 2008


Hi imc-alternatives,

Over the last few weeks Nick, Michael and I have been working really 
hard to develop wireframes for the alternatives site.  (what are 
wireframes? http://www.grokdotcom.com/wireframing.htm).  In the 
process we've been talking through a lot of basic questions about how 
the site will work and how people will use it.  At the last IRC 
meeting I volunteered to write a summary of our discussions.

(As you're reading this, check out the Wireframes page 
(https://we.riseup.net/imc-alt/wireframes+8070) on the 
imc-alternatives Crabgrass group for visual examples of what we're 
talking about.  Look at the attachments on the bottom right of fhe 
page.  The Nick2 wireframes are Nick's most recent and the Jay_New 
ones are mine.)

After some back and forth, Nick, Michael and I have conceived the 
site as having three separate but integrated main sections, which 
will allow users to be part of the Alternatives site in different but 
overlapping ways:

-- NEWS (news about alternatives, with both an open newswire and top 
features chosen by either editors/users)
-- KNOWLEDGE (the knowledge-base, a wikified knowledge resource about 
alternatives combining information about different alternatives 
topics, ala wikipedia, with practical how-to knowledge, like WikiHow 
or Instructables.
-- NETWORK (a place for individuals and organizations doing 
alternatives work to have their "home" by posting profiles and 
connecting with each other, through things like chat/forums/video and 
photo sharing etc., and a craigslist-style "wants/needs" section of the site.)

-- HOME will also be an equally-sized button at the top of the page 
and will give users a clear way to get back to the main page.

(remember, these are just suggestions.  this can change.)

CONSISTENT NAVIGATION:
Consistent navigation will be found at the top of each page, with 
large buttons reading Home -- News -- Knowledge -- Network providing 
the user with a clear way of accessing the main areas of the 
site.  (Check out "http://www.rhizome.org" for a decent example of 
what we're picturing for the top navigation.) We plan to offer 
submenus for each of the main areas, which the user will see when 
s/he puts a mouse over the main section tab.  There will be a login 
area in the upper right, a search bar, "about" and "contact" links, a 
place to select the site's language, and an "about the alternatives 
site" line below the tabs, which will double as the place you see the 
submenu options.  There will also be text navigation available 
running along the bottom.

THE HOME PAGE:
The home page (here's nick's most recent draft: 
https://we.riseup.net/assets/1314/nick2_wireframe_v2.gif) will be 
kind of a portal to the three sections of the site and will offer the 
top features in all three sections, as well a way to see the open 
posting wires from all three sections.  It will weigh toward news, 
meaning when a new user goes there s/he will see top News features 
and the open newswire but the user will also be able to access the 
top features and newswires of  the Knowledge and Networking sections.

"LANDING PAGES":
Each section (NEWS/KNOWLEGE/NETWORK) will have its own "landing page" 
which will be its own home -- a NEWS landing page which will give a 
user access to all Alternatives news features, newswires, blogs, etx, 
a KNOWLEDGE landing page which will be home to the knowledge base, 
and the NETWORK landing page which will offer many ways to network 
with other activists.

INFORMATION INTEGRATION:
Basically Drupal stores all its information in a database and that we 
use layout to decide how that information is viewed.  In that way, 
the three main sections of the alternatives site -- News, Knoweldge, 
Network -- are really just three different ways to view the same pool 
of information.  So, someone interested in solar thermal energy 
systems, for example, might go to the Knowledge base and search for 
"solar thermal."  That page would then call up the Knowledge base 
article/s about Solar thermal, as well as news articles about solar 
thermal (NEWS), users and organizations with solar thermal as their 
interest (NETWORK) and wants/needs/classifieds relating to solar 
thermal (also NETWORK).
Check out 
https://we.riseup.net/assets/1305/nick2_wireframe_article_v2.gif for 
an example of an article page.  (we changed "category" on the right 
column to "topic.")

The same would be repeated if the user starts looking for solar 
thermal information by going to NETWORK to find a list of 
users/organizations that do solar thermal work.  Other solar-thermal 
material from other main sections of the site would also appear on 
that page.  In that way, content on the site will be clear to access 
but will also be integrated across the main sections.

TOPICS:
Another way to access information on the site will be to focus on a 
particular topic, such as "sustainability" or "altnernative 
economics."  We've discussed creating a balance between a fixed 
"taxonomy," with editors choosing a dozen or so main topic areas, and 
allowing users to tag their own articles with subtopics within the 
main topics.  In any case, the main page for each topic will offer 
news articles about that topic, information about that topic from the 
Knowledge-base, and relevant Networking information.

In addition to the big topics above we've also talked a lot about 
more specific things, like where to put the PUBLISH button (we 
decided to put it in the top right below the navigation, and to have 
that be consistent on all pages), how to present the list of topics, 
whether to use tabs or other kinds of tricks in the Top Features and 
Newswire sections on the main page to allow the user access to 
multiple features/newswires in the same space, etc.  All these 
discussions have led back to larger questions of how users will find 
the Alternatives site both inspiring and indispensible.

After all this chatter, Nick is going to start working on some 
graphics to plug into his drafts so we can start looking at some 
real-life examples.  We're all excited to see what form the site 
starts to take.

If, after reading all this, you still would like to be part of the 
wireframe/design process, you are welcome!  E-mail me and I'll tell 
you how to plug in.

Feel free to ask questions/make comments etc,
Jay



More information about the Imc-alternatives mailing list