November 2010 Archives

HTML Update--Custom Menu Creator

| No Comments
I found an awesome free tool online today. It's called css3menu and it comes with custom skins for creating a more unique navigation bar. What's awesome is they also feature some "Apple" types so I was able to create a custom horizontal navigation bar that looks more like something we'd see on the ipad. The icons are bigger and bolder and they're easy to navigate. 

The only major setback I've come across involving this development is how to add the code I had from the search engine into this navigation bar. I'm trying to debug but it's not going so well...

Html project update--Landscape!!!

| No Comments
I just had a major epiphany and I figured I'd write it down before it escapes me.

To create the landscape format, all I really need to do is switch the interface so it has a vertical navigation bar. Basically all of my stories will be linked and it'll update the pages as you click on them.

And here I thought it would be so much more I'm really starting to get the hang of this!

*Update* Also, I've managed to incorporate a search engine to the top navigation bar. I'm in the works of creating a new top navigation bar, so we'll see how that goes :-)

iPad App Final Term Project Plans

As I've mentioned in previous blogs, I'd like to compile a fully-functional Setonian Online App for use of our paper. Although I worked on this for my first two units, I'm planning to expand on the final project, because there's still plenty of work to be done.

So far, I've created a main page template that works for each of the major sections of the paper. There is also a "share this" at the bottom of every page--I might switch this so it's only posted on actual story pages rather than the main news pages.

My goals for this project:

  • flesh out the rest of the basic links on the pages.
  • add a "view more" at the bottom of the page.
  • add a youtube video view--one for the main story as well?
  • add audio player--in case we want to put online exclusive full-length interviews.
  • landscape orientation changes to split screen mode--different interface
  • linking this style sheet to the existing setonian online? (final objective)

By this thursday, I'm pretty confident I'll be able to create at least the youtube-views. If I have extra time, maybe i'll also try to tackle the audio player as well.

By next tuesday, I'm hoping to have at least half of the coding completed for the landscape orientation.

What I'll need help with:
  • view more link
  • landscape orientation
  • linking stylesheet to setonian online

It's pretty unlikely that I'll have a polished product ready for the setonian online by the end of the semester, but it is my aspiration that I'll be able to at least show a working model...i hope.

Revised Midterm Portfolio

| No Comments

For EL 405: New Media Projects, we spent the last month revising our scratch, inform 7 and html projects. Below are links to each individual portfolio for these projects.


For my final project, I plan to expand on the Setonian App. Hopefully, I'll be able to generate a better masthead, a better horizontal navigation bar and possibly add youtube-viewing pages.


EL 405


Setonian App Portfolio

| No Comments

Although my working app prior to the revision stage was pretty sound, I knew I could make some major changes to improve the display. At the end of the unit, I created a few icons to link to "share this" pages. With the help of Dr. Jerz, I learned that there is javascript existing that already has the share this code. So, as one of my major revisions, I replaced my unworking icons with these ones.

In my usability test, you can see that the user doesn't have too much trouble navigating through my pages. Her biggest issues was the fact that a lot of my pages do not exist yet--they're simply there for decoration. One of the things I did fix, however was the window in the ipad. During her test, when I rotated to landscape view, the page took up more space than the display offered. Dr. Jerz gave us some new code to fix this issue.

One of my biggest changes this time around, however was my adding of photos to the design. I replaced the fake "frog" story with a legit story that was written for the setonian last issue. I made the picture, headline and description linkable. The only issue I had with this is the fact that chevrons appear on all three sections, when realy only need them for one. The same "main" story is found on the news, a&e and home pages.

In my mock-up, I envisioned thumbnail pictures next to the stories that included photos. Although I didn't include this the first time around, I added it in my revision. In the 5 greatest ipad cases article, you'll see that I formated several photos to fit in the text, to allow for stories with mutliple photos.

Check out my revision video to understand all of the change I implemented.

I plan to use this project as my final project as well.


EL 405

Inform 7 Portfolio

| No Comments

For my second project in EL 405, I designed a murder mystery game. During my initial usability test, I found plenty of issues to resolve. Initally, I only had two endings, both losses.  So, as part of my revision, I created a win scenario.

My user made a comment about contaminating evidence as well, so I created gloves to prevent evidence contamination.

During my screencast usability test, I learned a lot about my game. I'd already implemented some changes, but needed to trouble shoot them. I coded the game to prompt a loss if the player picked up any objects without wearing the gloves. However,I never told the player in my text that she needed to wear gloves. Thus, she expressed frustration when the game ended before she could do anything.

To fix this issue, I set the game up to warn the player once before ending the game. I also prevented the player from leaving the room without wearing the gloves. That way, even if the other clues aren't big enough hints, eventually he'll have to check his inventory and will hopefully put on the gloves.

Another issue I ran into during my second usability test was the lack of direction for the player. I gave her full reign to travel throughout the map without concequence (aside from losing after a select number of turns). To create a more linear game, I set up a few puzzles on the bottom level to explain some of the functionality of the game. The player didn't understand that she needed to give clues to her partner, so I added some descriptions suggesting that the player try showing evidence to the player.

In my revision, I talk about these issues, as well as a few others. Namely, I discuss the way in which I coded the "partner-mood" to prompt the win. In order to win, the player must give a certain amount of clues in succession to the partner to improve the partner's mood. Giving a non-clue moves the partner-mood in a negative diretion.

Aside from these revisions, I fixed some typos and also some room descriptions that mentioned directions to additional rooms that I never had the chance to actually code.

My screencast revisions are separated into two videos for viewing:

Revision Part 1

Revision Part 2

Check out my game! I'd love to hear your feedback.


El 405

Scratch Revision Portfolio

| No Comments
In EL 405, we worked diligently over the past few weeks to usability test and revise our scratch programs. My project, a maze entitled Mouse!, underwent significant improvements. 

In my usability test screen cast, you'll note that I implemented some new ways to encourage gamers to play through the full game. However, my first efforts were not as successful as I'd hoped. I filled the levels with random foods that the user could grab as he progressed through the mazes. However, because there were so many, and because they appeared so frequently, he didn't seem to eager to go out of his way to snatch some extra points. 

For my revision, I made some significant revisions to my original plan. I still wanted to include the fruit and other foods, because it encouraged players to travel to otherwise useless areas of the maze. This meant risking the chance that they might run into a bat, which ends the game with a loss. I also revised the number of fruit for each level. As you'll notice in my revision screencast, the player has the opportunity to pick up 3 bunches of bananas throughout the first level, 3 bananas and 3 cherries in the second, and 3 bananas, 3 cherries and 3 cookies. Each fruit appears after a set amount of time, and the second of each group only appears after the first has been captured.

A last fruit stands alone as a "special" reward in my game. During my usability tests, all of my users pointed out that they didn't like how difficult it was to see the bats on the dark background. Although I wanted this to remain the same, because it adds to the difficulty, I wanted to give them a reward for navigating through almost blindly. Thus, I created this green apple sprite, which changes the background color from black to white for about 30 seconds. In my eyes, it makes both parties happier. 

To increase the challenge of the game as players progress through the levels, I created some special bats, which I refer to as Rogue Bats. These bats are not on a set path like their brothers. Instead, their path relies on the player's movement. For example, if the player presses the down arrow, the bat's direction would rotate by 15 degrees, and he would continue on his path.

This bat does not appear until the second level, and by the third level, there are two wandering around, one larger and faster than the other. The only other major change I implemented in my revision was finally making the user's sprite navigate smoothly throughout the maze. In my usability tests from our first unit, my players kept getting stuck on walls. With some renovated code, I was able to fix this issue.

So, without further delay, please sample my revised game, Mouse!!

About this Archive

This page is an archive of entries from November 2010 listed from newest to oldest.

October 2010 is the previous archive.

Find recent content on the main index or look in the archives to find all content.