While this site hits upon some of the features of gaming that I would like to explore in my own style, it feels like there is a foundational piece of the puzzle missing from this design. The learner is positioned into the narrative as a detective, which is good because a gamer needs to have a character to play. The iconography is present to set the tone and mood of the playing environment. There are interactive components such as web navigation and quizzes, but these elements feel more like restrictions than keys components to progressing through a narrative. Nonetheless, an interesting site to explore when you're feeling adventurous.
Tuesday, May 24, 2011
Internet Detective
I've been thinking a lot lately about instructional approaches to information literacy. Although there are many avenues of thought that need exploration, and I detailed map that I have yet to construct, one such road involves the use of games as an engagement strategy for learners. Today, I stumbled across an interactive site for the instruction of Internet evaluation for academic research at the following URL: http://www.vtstutorials.ac.uk/detective/.
Sunday, May 22, 2011
Beginning Again
Since I haven't posted to this blog in over a year and a half, I could easily delete the presence of this blog, but I've decided to give it another shot. Instead of maintaining a tight focus of investigation as I had originally intended to do, I will be using this space as a general platform to write my thoughts as they arise from some of the readings that I pursue. The object of inquiry will be information, but looked at through a wide-angled lens. I also hope that these notes will be entertaining, because if I can't entertain myself in this space, I don't see how I will get any enjoyment out of returning to these pages to type out my thoughts.
Thursday, November 19, 2009
XHTML/CSS Page Foundation - Resources
1. Most of the foundation of the XHTML/CSS page arouse from a reading of the following book:
Sauers, Michael P. XHTML and CSS Essentials for Library Web Design. Neal-Schuman Publishers, 2005.
2. The pseudo-Latin filler text was generated from the following website:
http://www.lipsum.com/
3. To get the XHTML/CSS code to display properly in the blog post, I had to find and replace the <> characters.
** This replacing was only for display purposes. Prior to temporarily changing the code for display purposes, both the XHTML and CSS for the code were validated by:
W3C CSS Validation Service located here: http://jigsaw.w3.org/css-validator/
W3C Markup Validation Service located here: http://validator.w3.org/
Sauers, Michael P. XHTML and CSS Essentials for Library Web Design. Neal-Schuman Publishers, 2005.
2. The pseudo-Latin filler text was generated from the following website:
http://www.lipsum.com/
3. To get the XHTML/CSS code to display properly in the blog post, I had to find and replace the <> characters.
** This replacing was only for display purposes. Prior to temporarily changing the code for display purposes, both the XHTML and CSS for the code were validated by:
W3C CSS Validation Service located here: http://jigsaw.w3.org/css-validator/
W3C Markup Validation Service located here: http://validator.w3.org/
XHTML/CSS Page Foundation
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!-- begin XML namespaces -->
<!-- XML namespaces uniquely identify the XML language used in this document -->
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<!-- end XML namespaces -->
<!-- begin header information -->
<head>
<!-- name of title to appear in the top of the web browser -->
<title></title>
<!-- ...........................begin CSS stylesheet............................ -->
<style type="text/css">
/* style attribute for the body element */
body {
margin-left: 10%; margin-right: 10%;
color: black; background: white;
text-align: center;
margin: 0px auto;
}
/* style attributes for paragraph element */
p {
margin-top: 0;
margin-bottom: 0;
font-size: 1em;
font-family: monospace;
}
/* style attributes for title_box at the top of the web page */
div.title_box {
border: 1px solid #CCC;
width: 800px;
height: 100%;
margin: 10px 10px 10px 10px;
}
div.title_box p {
margin-top: 0;
margin-bottom: 0;
font-size: 1em;
}
/* style attributes for nav.bar under the title_box */
div.nav_bar {
width: 800px;
padding: 0;
margin: 10px 10px 10px 10px;
}
div.nav_bar ul {
padding: .3em .1em;
margin: 0;
text-align: center;
font-size: 1em;
font-family: monospace;
}
div.nav_bar li {
display: inline;
list-style-type: none;
border: 1px solid #CCC;
margin: 10px 10px 10px 10px;
}
div.nav_bar a {
text-decoration: none;
}
div.nav_bar a:link {
color: black;
}
div.nav_bar a:visited {
color: black;
}
div.nav_bar a:hover {
color: black;
}
/* style attributes for the main compartment on the web page */
div.main {
text-align: center;
height: 100%;
width: 800px;
border: 1px solid #CCC;
margin: 10px 10px 10px 10px;
}
/* style attributes for the footer at the bottom of the web page */
div.footer {
width: 800px;
height: 100%;
border: 1px solid #CCC;
margin: 10px 10px 10px 10px;
}
</style>
<!-- ...................end CSS stylesheet......................... -->
</head>
<!-- end header information -->
<!-- ...................begin document body........................ -->
<body>
<!-- title_box content -->
<div class="title_box">
<p align="center">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin in eros quis elit mollis tempus vitae a odio. Integer sed tellus massa, nec viverra odio. Nam tempor varius tellus in bibendum. Donec leo mi, vehicula vel bibendum at, dapibus eu lacus.</p>
</div>
<!-- nav_bar content -->
<div class="nav_bar">
<ul>
<li><a href="">Home</a></li>
<li>Something</li>
<li>Something</li>
<li>Something</li>
<li>Something</li>
<li>Something</li>
</ul>
</div>
<!-- main compartment content -->
<div class="main">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin in eros quis elit mollis tempus vitae a odio. Integer sed tellus massa, nec viverra odio. Nam tempor varius tellus in bibendum. Donec leo mi, vehicula vel bibendum at, dapibus eu lacus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Integer dapibus nunc sed eros elementum ut accumsan elit iaculis. Suspendisse elit libero, adipiscing vitae semper vel, fringilla ac dolor. Pellentesque ut enim purus. Quisque varius dui in ligula adipiscing sit amet eleifend tortor posuere. Vestibulum hendrerit gravida neque, sit amet lobortis nulla elementum vel. Vestibulum eget justo a mauris bibendum dictum. Phasellus lobortis gravida erat, sed posuere nunc auctor eu. Ut non nisl nec justo ornare ullamcorper. Ut at lorem libero. Nunc sollicitudin feugiat mauris a dictum. Ut hendrerit nisl sit amet ipsum malesuada facilisis aliquet erat porttitor. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; </p>
</div>
<!-- footer content -->
<div class="footer">
<p align="center">Derek C. Zoladz 2009</p>
</div>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!-- begin XML namespaces -->
<!-- XML namespaces uniquely identify the XML language used in this document -->
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<!-- end XML namespaces -->
<!-- begin header information -->
<head>
<!-- name of title to appear in the top of the web browser -->
<title></title>
<!-- ...........................begin CSS stylesheet............................ -->
<style type="text/css">
/* style attribute for the body element */
body {
margin-left: 10%; margin-right: 10%;
color: black; background: white;
text-align: center;
margin: 0px auto;
}
/* style attributes for paragraph element */
p {
margin-top: 0;
margin-bottom: 0;
font-size: 1em;
font-family: monospace;
}
/* style attributes for title_box at the top of the web page */
div.title_box {
border: 1px solid #CCC;
width: 800px;
height: 100%;
margin: 10px 10px 10px 10px;
}
div.title_box p {
margin-top: 0;
margin-bottom: 0;
font-size: 1em;
}
/* style attributes for nav.bar under the title_box */
div.nav_bar {
width: 800px;
padding: 0;
margin: 10px 10px 10px 10px;
}
div.nav_bar ul {
padding: .3em .1em;
margin: 0;
text-align: center;
font-size: 1em;
font-family: monospace;
}
div.nav_bar li {
display: inline;
list-style-type: none;
border: 1px solid #CCC;
margin: 10px 10px 10px 10px;
}
div.nav_bar a {
text-decoration: none;
}
div.nav_bar a:link {
color: black;
}
div.nav_bar a:visited {
color: black;
}
div.nav_bar a:hover {
color: black;
}
/* style attributes for the main compartment on the web page */
div.main {
text-align: center;
height: 100%;
width: 800px;
border: 1px solid #CCC;
margin: 10px 10px 10px 10px;
}
/* style attributes for the footer at the bottom of the web page */
div.footer {
width: 800px;
height: 100%;
border: 1px solid #CCC;
margin: 10px 10px 10px 10px;
}
</style>
<!-- ...................end CSS stylesheet......................... -->
</head>
<!-- end header information -->
<!-- ...................begin document body........................ -->
<body>
<!-- title_box content -->
<div class="title_box">
<p align="center">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin in eros quis elit mollis tempus vitae a odio. Integer sed tellus massa, nec viverra odio. Nam tempor varius tellus in bibendum. Donec leo mi, vehicula vel bibendum at, dapibus eu lacus.</p>
</div>
<!-- nav_bar content -->
<div class="nav_bar">
<ul>
<li><a href="">Home</a></li>
<li>Something</li>
<li>Something</li>
<li>Something</li>
<li>Something</li>
<li>Something</li>
</ul>
</div>
<!-- main compartment content -->
<div class="main">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin in eros quis elit mollis tempus vitae a odio. Integer sed tellus massa, nec viverra odio. Nam tempor varius tellus in bibendum. Donec leo mi, vehicula vel bibendum at, dapibus eu lacus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Integer dapibus nunc sed eros elementum ut accumsan elit iaculis. Suspendisse elit libero, adipiscing vitae semper vel, fringilla ac dolor. Pellentesque ut enim purus. Quisque varius dui in ligula adipiscing sit amet eleifend tortor posuere. Vestibulum hendrerit gravida neque, sit amet lobortis nulla elementum vel. Vestibulum eget justo a mauris bibendum dictum. Phasellus lobortis gravida erat, sed posuere nunc auctor eu. Ut non nisl nec justo ornare ullamcorper. Ut at lorem libero. Nunc sollicitudin feugiat mauris a dictum. Ut hendrerit nisl sit amet ipsum malesuada facilisis aliquet erat porttitor. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; </p>
</div>
<!-- footer content -->
<div class="footer">
<p align="center">Derek C. Zoladz 2009</p>
</div>
</body>
</html>
Sunday, August 23, 2009
Books - Technical - Opening Literature
Westman, Stephen R. Creating Database-Backed Library Web Pages. Chicago: American Library Association, 2006.
Rhyno, Art. Using Open Source Systems for Digital Libraries. Westport, Libraries Unlimited, 2004.
Kabir, Mohammed J. Apache Server 2 Bible. Wiley, 2002.
Welling, Luke and Laura Thomson. PHP and MySQL Web Development. Addison-Wesley Professional, 2008.
Sauers, Michael P. XHTML and CSS Essentials for Library Web Design. Neal-Schuman Publishers, 2005.
Rhyno, Art. Using Open Source Systems for Digital Libraries. Westport, Libraries Unlimited, 2004.
Kabir, Mohammed J. Apache Server 2 Bible. Wiley, 2002.
Welling, Luke and Laura Thomson. PHP and MySQL Web Development. Addison-Wesley Professional, 2008.
Sauers, Michael P. XHTML and CSS Essentials for Library Web Design. Neal-Schuman Publishers, 2005.
Monday, August 10, 2009
CmapTools - Mind-mapping Software
CmapTools is a software application provided by the Institute for Human and Machine Cognition. Here is a link to CmapTools: http://cmap.ihmc.us/conceptmap.htm.
Installing CmapTools does require Sun Microsystems Java, which is not open source (but it is free to distribute). This does stray a bit from my original plan of using all open source software. However, this software will not be utilized in any functional manner, only in a descriptive manner, i.e. making visual mappings of thought for planning purposes. I chose CmapTools over some other open source mindmapping projects because of the ability to verbally describe the relationship between elements of each map.
Downloading the software is easy enough, but configuring it to work on Ubuntu is a bit tricky. First, the permissions of the downloaded .bin file will need to be changed.
(1) Open terminal and type:
chmod 755 LinuxCmapTools_v5.03_04-07-09.bin
LinuxCmapTools_v5.03_04-07-09.bin being the version of the file I downloaded.
(2) Then, execute the command from terminal:
./LinuxCmapTools_v5.03_04-07-09.bin
(3) CmapTools conflicts with Compiz/Beryl. Visual desktop effects will have to be disabled by doing the following:
System -> Preferences -> Appearance -> Click on the 'Visual Effects' tab -> select none
Installing CmapTools does require Sun Microsystems Java, which is not open source (but it is free to distribute). This does stray a bit from my original plan of using all open source software. However, this software will not be utilized in any functional manner, only in a descriptive manner, i.e. making visual mappings of thought for planning purposes. I chose CmapTools over some other open source mindmapping projects because of the ability to verbally describe the relationship between elements of each map.
Downloading the software is easy enough, but configuring it to work on Ubuntu is a bit tricky. First, the permissions of the downloaded .bin file will need to be changed.
(1) Open terminal and type:
chmod 755 LinuxCmapTools_v5.03_04-07-09.bin
LinuxCmapTools_v5.03_04-07-09.bin being the version of the file I downloaded.
(2) Then, execute the command from terminal:
./LinuxCmapTools_v5.03_04-07-09.bin
(3) CmapTools conflicts with Compiz/Beryl. Visual desktop effects will have to be disabled by doing the following:
System -> Preferences -> Appearance -> Click on the 'Visual Effects' tab -> select none
Subscribe to:
Posts (Atom)