Ambient Information Wordpress Plugin

Ambient displays normally communicate on the periphery of human perception, requiring minimal attention and cognitive load. Perceptual bandwidth is minimized; users get the gist of the state of the data source through a quick glance, aural refocus, or gestalt background ambience.

- Ambient Display Research Group

I am interested in embedded ambient information into web sites. On my home page I vary the color of the box at the top of my website fades from green to black as the age of the most recent post increases. If the blog is “fresh", the color of the box at the top matches the menu bar on the right side of the page. If the latest post is over 4 days old the box will be black. The colored bar on the post title also fade at the same rate.

To do this, I created a Wordpress plugin. The plugin allows you to make a call to a function that returns a color string that varies depending on the age of the last post. It also allows you to call the function that returns a color string that varies depending on the age of a specific post.

Instructions for Use

To use this plugin with wordpress do the following:

1. Download the php file:ambinfo.phps
2. Save it to your wp-content\plugins directory with the name ambinfo.php.
3. Edit the ambinfo.php to use the values for $ambinfo_stale_time, $ambinfo_fresh_color, and $ambinfo_stale_color to be the values that you desire.
4. Go to the your Wordpress plugin admin page and activate the plugin.
5. Modify your index.php file to call ambinfo_echo_age_color() or ambinfo_get_age_color().

Example

Here is a suggested modification that works with the default index.php and wp-layout.css files.

1. Open wp-layout.css and delete the following section:

   #header {
   	background: #90A090;
   	font: italic normal 230% 'Times New Roman', Times, serif;
   	letter-spacing: 0.2em;
   	margin: 0;
   	padding: 15px 10px 15px 20px;
   }
      

2. Open index.php and paste the following block:

   <style type="text/css">
   	#header {
   		background: <?php ambinfo_echo_age_color();s?>;
   		font: italic normal 230% 'Times New Roman', Times, serif;
   		letter-spacing: 0.2em;
   		margin: 0;
   		padding: 15px 10px 15px 20px;
   	}
   </style>
   

   Doing this will change the background color of the header at the top of your blog from green to black, depending on how old the last post is.

   For questions, comment, support and encouraging words use: ambinfo-wp-plugin [at] 0blog [dot] com

XML Design Patterns