Ben Nadel
On User Experience (UX) Design, JavaScript, ColdFusion, Node.js, Life, and Love.
Ben Nadel at InVision In Real Life (IRL) 2019 (Phoenix, AZ) with: Jonathon Wilson
Ben Nadel at InVision In Real Life (IRL) 2019 (Phoenix, AZ) with: Jonathon Wilson@chilkari )

Skin Spider : Starting Iteration 2 With Application Reflection And Evaluation

By Ben Nadel on

To learn all about Skin Spider, click here.

To view the most updated application, click here.

To view the current code base, click here.

I think the Skin Spider application is at a point now where we can be done with Iteration One. Iteration One was a shot-gun approach to web development; really shooting from the hip, getting ideas down on paper as you get them, weaving it all together when required, repeating yourself, throwing together a working application. Now that we have that, it's time to step back and evaluate the application that we have built, see where we can start to refactor, and determine where it would be good to add functionality.

I have broken up the comments / updates into three different areas: Framework updates, work flow updates, and interface & usability updates. The framework updates are code organization and methodology updates. The work flow updates are for user's "session experience." The Interface updates are for the interface to the system.

Framework Updates


For starters, we want to get with the times. ColdFusion MX 7 started to offer an Application.cfc ColdFusion component as the upgrade from the Application.cfm ColdFusion template. This does the same thing, however the Application.cfc allows us better control over application events such Application Start Up and Application Shut Down. We will be updating the application to use Application.cfc. This should simplify our application set up and initialization (among other things).

Application Configuration

I personally don't like having so much configuration code in the Application.cfm (soon to be Application.cfc). I would like to see the configuration code pulled out into its own template or component. This should make the code easier to read and maintain. It will also allow us to swap configuration code in and out of an application with ease if we needed to do so.

Page Data

Right now, the only page data that we are setting for each page call is the REQUEST.Page variable. The site navigation uses this to determine which navigation elements should be turned on / off. This is nice, but it is very limiting. I would like to see more page data available for getting / setting. Even small things like changing the html title tag are good practices in web development. We might need to pull the page data out into its own object from which we can get and set information.

User Defined Function (UDF) Library

The applicaiton right now is not very UDF heavy. However, it is good practice to pull our UDFs out into some sort of library. That way, we don't repeat our code as much and will also increase our ability to reuse functionality. I will most likely move the UDF's into some sort of library component that will be persisted in the application.

Data Pagination

The data pagination on the search page is a mess. Right now we are only doing pagination in one place so it's not out of control, but, in the future we might need to do this elsewhere (maybe the favorites page). Let's pull the logic for the pagination out and put it in either a custom tag or a component that will allow us to more easily apply paginated results in multiple places.

MetaForm Data

Right now, our form pages really only check to see if the form has or has not been submitted. This is done through the REQUEST.Attributes.submitted value. I feel that this is too restrictive. It locks us into having a form with only two modes. After having used ColdFusion custom tags, I really like the way they use THISTAG.ExecutionMode. I would like to do something along these lines where we can check what "mode" a form is executing in, rather than just checking for submission. This will allow us to handle times when a page may just be refreshing (in which case it is neither processing nor initializing).

Post Form / Pre Page Processing

One thing that bugs me is that whenever we need to ouput data to a form page, we need to escape any double quotes (with ") so that our input form fields do not break (you cannot have proper quotes inside of a quoted attribute. Well, I guess it doesn't bother me per say; what bothers me is that we have to manually do it during form data initialization. I would like to see this pulled out and automated to some degree. I think this can be done by performing either some sort of global post-form processing or global pre-page processing. Not sure what exactly, but this might be a good use of a custom tag page wrapper (ex. <page:wrapper></page:wrapper>).

Work Flow Updates

Referring Page Navigation

Currently, on any of the form pages that have a success page or a "Cancel" button, the URL of that target page is hard coded. This can cause real inconveniences. Take for example the video edit page. You can get to this from the search page OR the favorites page and yet, both the cancel button and success page take you to the search page. This kind of work flow is both frustrating and confusing for a user. We need to develop some sort of system for sending a user back to their referring page.

Page-Equivalent URL

This is more of a Framework issue, but I am putting it here because it ties into the referring page navigation. We need to develop a way to have a page-equivalent URL for every non-database-updating page. By this I mean that for any page in the system (search result page, main pages, etc) we need to be able to create a URL that will take you directly there. This will help us be able to keep track of the user's navigational history and then be able to redirect them with more accuracy.

Library Usage Statistics

I would like to see some sort of statistics being stored for videos in the library. Right now, people just access a video from the file system (via a URL) and that is the end of it. I would like to have the system serve up the video itself. This doesn't need to be a CFContent type thing, but I would like to have the request go through a ColdFusion page (even if the result is a simple CFLocation to the file). This at least, would allow us to keep track of how frequently and infrequently items are viewed (this will come into play next).

Mass Deleting

Since we are spidering pages blindly, we are going to get a LOT of crap in the mix. I would like to take the usage statistics (mentioned previously) and create a system were a user can delete items from the library en mass. For example, I think it would be great if a user could delete all videos never viewed or perhaps all videos that have not been viewed since a certain date (say, within the last three months). This would help the user keep the library clean and populated with only user-approved data. I am thinking maybe a section titled "Clean Library" as part of the primary navigation.

Smart Tagging

When a user adds a tag to the system for video categorization, they need to go through and manually create relationships. I would like the user to be able to set up "auto-tagging". I am thinking that for each tag, the user can set a list of keywords that will be matched against the HTML page title of a given gallery. Any tag that has a matching keyword in the title will automatically be tagged with that tag.

Interface Updates

AJAX Bells And Whistles

Right now, if you want to perform even simple tasks like rating a video or flagging it as a favorite, you have navigate away from the current page and into the video editing page. I would like to move this into a snappier AJAX interface where a user can rate / flag videos from within the search results. I think this will really improve the usability of the application.

Reader Comments