Future Wave Web Developments

If you're new here, you may want to subscribe to my RSS feed. Thanks for visiting!

Right now I’m working on a project for the Main Street Art Gallery in Carrboro, NC.  The site is here:
http://CarrboroArtGallery.com

I setup a top banner for the gallery that shows a transition between a few different images and some accompanying text.  This is displayed at the top of the web pages.  Then I setup an image wall, a 3D Photo Wall, made up of photos that I took from the art gallery, photos of the Art, Antique Pottery and other Antiques.

Currently, I’m trying to figure out why this component is giving me an error when the application tries to load the full-size images.  These application begins by loading a set of thumbnail images.  I’ve specified a glow when you move the mouse over a thumbnail image and many numerous other settings were tweaked to get a particular look.  The application has images, thumbnail images, zoom in to view.  Then when you move your mouse over the image, you get a glow around the thumbnail.  When you click on the image, it zooms in to view just that particular image, in full size.

The problem I am currently having with the application is that when one clicks on the thumbnail image, that’s when an error is coming up.  This is a commercial application that was developed for Flash, that I am using, meaning some of the code was developed by the fokes at Flashloaded.com.  So, I’ve turned to their support forum for ideas.

As a web developer, I don’t mind starting my work by using some components that were developed by someone else.  It’s just a matter of some part of the larger whole of what I am developing, involves the use of a component that someone else developed.  I suppose I’ll try harder to make my own components available so that others can use those components as part of a whole for what they are developing.  In developing applications for the web and for the desktop, one often uses components or modules that are parts of a larger whole application.

Actually, in developing a web application, there are even more parts to the whole, as it were.  There is the CSS, to style the webpages, there is the webpage itself that holds the Flash application (by Flash application, I mean something that was developed in the Flash Development environment, sometimes referred to as flash itself but that can be a misnomer, because there is the Flash player that runs the final Flash application and the Flash Development Environment used to create the Flash application).  So, we’ve got the webpage holding the Flash application, the CSS to style the appearance of the web page, the Javascript used to control various web page interactive features.  In addition, with this application, like the other one I described in my previous blog post, there is an xml file used to specify the images that are used in the image gallery.

I thought I’d run a series on the valuable skills I’m developing though my studies at Lynda.com.  The goals will be to see how my new skills can be marketable so that I can make a living doing more of what I enjoy doing and what I am good at doing (hopefully).

So, I’m following the course Actionscript 3.0 Beyond the Basics, by Todd Perkins.  This title can be purchased on DVD from amazon.com also, by the way.  In chapter 3 of this title, we create an XML dynamic photo gallery application in Flash.  What does this mean?  Well, XML is a markup language.  HTML and XHTML are markup languages used for designing web pages and both are based on or derivations of XML.  By using XML, in the creation of a photo gallery, one can create a nice image gallery in Flash and just specify your images in an xml file.  An xml file is just a text file;  so it is easy to add images to the text file and thus update your gallery.

So an example of that gallery that was created in this exercise is available here. What makes it dynamic is that you can easily update just that one file, and upload additional images to easily setup the gallery to display whatever photos you want to display.  In this gallery, I setup the effect to have the images move into place and fade into view from fully transparent to fully opaque (meaning, fully transparent is when the image is not visible, and fully opaque is when the image is opaque, during the transition is fades into view).

I wanted to discuss an application that was perfect for publishing poetry books/magazines on the web but can also be used in exciting ways to publish all manner of content on the web.  Two quick ideas come to me as to how this could be used in different areas or ways - one  could use this for online brochures, photo or albums.

People have been publishing poetry magazines on the web for some time.  During this time, the online version of a magazine, made me think that perhaps the name “magazine” didn’t fit for what we were publishing.  I’m very open to new ways of looking at things but a magazine just didn’t quite seem like the word to describe an online publication of poetry.  That has changed.  I found a new tool, or application, that creates online books and magazines on the web.  They run in the Flash player on the web.  I wasn’t worried about that because 98% or thereabouts, of all internet users have the required version of this software, necessary to run these applications,  installed on their computer, and so they are going to see what I publish just as I intend it to appear.

So, this tool, or type of tool (there are different designs that implement this in very similar ways), presents on the web page, an interactive application that looks like a magazine or book.  You can have a cover, and then open up the book to different pages.  When you open up the book/magazine (let me use book as a general term to refer to magazines or books in this format), you see  a two page spread.  One can even include the sounds of turning  a page.  One can drag the corner of a page or click on the next button to move to the next page.  I find it very exciting and creative.  I feel I can be creative with this application or type of application.

To see an example of how this works and how I implemented this on Word Salad please click on this link here:  http://wordsaladpoetrymagazine.com/VolumeXIVNoIV/books-published-by-word-salad.html
I setup two categories.  The first category will be for the different versions of Word Salad that are published on the site, specifically, Volume XIV, No IV, the winter 2008-2009 edition and the most recent version, the Spring 2009 edition, Volume XV, No I.

Again that link is:  http://wordsaladpoetrymagazine.com/VolumeXIVNoIV/books-published-by-word-salad.html

This article is a continuation of what I wrote in the previous article where I described how a Content Management System works, from a very basic standpoint - that is without getting to technical.

While, Word Salad, the publication, is only updated, or published with a new issue, and new content, once every 3 months, there is still a great benefit to being able to update, edit and create content in this fashion, without having to ever start from scratch as it were.  In addition, for community sites, like “Poet’s Place” where users can update the site content as often as desired or whenever someone wants to contribute to the community, this can be done by anyone registered at the site, and as often as desired.

Poet’s Place is an online community website that I created some time back.  Please visit the site here:  http://WordSaladPoetryMagazine.com/PoetsPlace/
to join the community.  What you do is click on the link, “Register/Join the Community” from the menu on the left.  It will ask for your name, username, password, and an email address.  That’s all it takes to join.  You’ll get an email asking you to confirm your registration and when you click on the link, you are instantly a part of the community.  You can post articles, news, announcements, web links, and more.  There is even a place to share your own poetry and get feedback.

As I was stating in my previous posting, I chose Joomla as the tool, the application, to publish a poetry magazine on the web.  This is certainly not an indication of the extent to which Joomla can be used to create dynamic/interactive websites (I guess, I probably should explain elsewhere what a dynamic website is or an interactive website and why that would be of interest to you or how such a tool could meet a need that you might have).

Let me explain, somewhat briefly, what a CMS is.  A CMS is different than the original static websites that represent the way web sites were designed and developed from the beginning.  A static website is made up of static web pages, that is pages that do not have any interactivity and the content on each page does not change.  To update a static site, one either edits existing files or creates new files - when I say files, I mean web pages.  A CMS system creates the pages dynamically from information, aka data or content that is in a database.

Updating a CMS involves entering information into form fields just like entering an email message on the web or using a social networking site, like facebook.com, or updating a blog.  The software takes the information that is in the database and displays it to the user when a page is requested.  All the stories, data, content, or information is saved in the database.  New content can be added to the website without having to create and edit web pages and then upload them for each and every edit, change or update.  So, this is what we call a dynamic website.  Dynamic websites are contrasted with static websites, by allowing in the dynamic website user interaction with the site, new and fresh content can be added as often as desired.  The presentation in Joomla is controlled by Templates.  By changing the template, which can be done by just making a simple selection, meaning clicking on a button, using the administration software, and you change the entire layout and presentation of the content on the site.

This makes it easy to update the site without having to start from scratch with a new design.  By selecting different templates the entire look of the site can be changed whenever desired.

In the next article, I’ll describe some of the ways I used Joomla to publish poetry on the web or to create a poet’s community on the web.

I am going to try to explain, in terms that are not to technical or boring to folks that might not necessarily be very technically oriented, what Joomla is, what a Content Management System is,  and why I chose that to publish Word Salad Poetry Magazine. I posted an article very similar to this on my poetry blog which is here:  http://WordSaladPoetryMagazine.com/words/

Joomla is a Content Management System (CMS).  There are many different CMS that have been developed.  I won’t get overly technical or pedantic about why I chose Joomla over other CMS or what makes Joomla a good CMS. However, maybe I’ll list a few points as to why Joomla is a good tool for publishing a poetry magazine.  I’ll present a list here:

1) Joomla is software that is free and open-source, making it a great tool for an organization that has no budget.

2) As an open-source product, there is a large developer community to ensure that the product is reliable, tested and secure.

3) Joomla is very easy to configure, administer and to use to develop applications.

4) While being relatively simple, it is a powerful tool for web developers looking to use their coding/programming skills to create a customized application - an application that is specifically developed to meet specific needs, interests or desires.

5) There is a large number of existing extensions that have been designed and developed, which helps the web developer, in this case, myself, in customizing an application to the needs of the task at hand or the client/customer.

In the next posting, I’ll explain what a Content Management System is and further explain how it was used in this particular application.

Instead I’ll just explain what a CMS is and why I thought it would be good for Word Salad.  A CMS is different than the original static websites that represent the way web sites were designed and developed from the beginning.  A static website is made up of static web pages, that is pages that do not have any interactivity and the content on each page does not change.  To update a static site, one either edits existing files or creates new files - when I say files, I mean web pages.  A CMS system creates the pages dynamically from information, aka data or content that is in a database.

Updating a CMS involves entering information into form fields just like entering an email message on the web or using a social networking site, like facebook.com, or updating a blog.  The software takes the information that is in the database and displays it to the user when a page is requested.  All the stories, data, content, or information is saved in the database.  New content can be added to the website without having to create and edit web pages and then upload them for each and every edit, change or update.  So, this is what we call a dynamic website.  Dynamic websites are contrasted with static websites, by allowing in the dynamic website user interactionwith the site, new and fresh content can be added as often as desired.  The presentation in Joomla, which is the name of the CMS application that I chose for Word Salad, is controlled by Templates.  By changing the template, which can be done by just making a simple selection using the administration software, and you change the entire layout and presentation of the content on the site.

This makes it easy to update the site without having to start from scratch with a new design.  By selecting different templates the entire look of the site can be changed whenever desired.  While, Word Salad, the publication, is only updated, or published with a new issue, and new content, once every 3 months, there is still a great benefit to being able to update, edit and create content in this fashion, without having to ever start from scratch as it were.  In addition, for community sites, like “Poet’s Place” where users can update the site content as often as desired or whenever someone wants to contribute to the community, this can be done by anyone registered at the site, and as often as desired.

Poet’s Place is an online community website that I created some time back.  Please visit the site here:  http://WordSaladPoetryMagazine.com/PoetsPlace/
to join the community.  What you do is click on the link, “Register/Join the Community” from the menu on the left.  It will ask for your name, username, password, and an email address.  That’s all it takes to join.  You’ll get an email asking you to confirm your registration and when you click on the link, you are instantly a part of the community.  You can post articles, news, announcements, web links, and more.  There is even a place to share your own poetry and get feedback.

Recently, I started developing applications for the web using Adobe Flex.  What I have been trying to do is to create Rich Internet Applications - a topic that I discussed in the article just before this, entitled “What is Flex?  What is a Rich Internet Application? Part I.”  Not every application will Wow my viewers, but this application did take some effort and work.  The goal was to create and display a rather long form in a wizard-like format.  I had a long form that I wanted to break up into sections, making it easy to move from one set of questions to the next.

I had turned to a great example from the text, “Foundation Flex for Designers, by LordAlex Leon and Greg Goralski.  In chapter 11, they presented a very nice multi-stage using an accordion component.  In my form, there are 4 stages, each presented as an accordion pane.  It is available here:
http://futurewavedesigns.com/QuoteForm/#

Adobe Flex is a tool create “Rich Internet Applications.”  So, that brings us to the topic of what is a “Rich Internet Application.”  WIKIPEDIA, the Internet Encyclopedia, defines a Rich Internet Application as an application that runs, typically on the web, and has some of the characteristics of desktop applications. (ref. http://en.wikipedia.org/wiki/Rich_Internet_application ).

Wikipedia goes on to say, “The term was introduced in the 1990’s by vendors like Macromedia who were addressing limitations at the time in the “richness of the application interfaces, media and content, and the overall sophistication of the solutions” by introducing proprietary extensions^[4].”

So, what does this mean?  I don’t want to assume that readers of this article do or do not have any specific level of knowledge or understanding, so some of what I say might be too basic for some folks.  Hopefully, I do not speak in too technical of terms to confuse others.  So, what is a desktop application?  Well, computers these days typically run a wide range of software.  This ranges from MS Word (word processing), Spreadsheets, Games, Web Browsers, Business Accounting, video and audio players and so much more.  Each of these applications run in a window with drop down menus, buttons, panels, and more.  These are tools to help the user accomplish a wide range of tasks… to make it as easy and intuitive as possible to use the software.

On the web, everything, for the most part, has run in a web browser.  The content of each web page appears in the main window of the browser.  Up until recently, the content did not allow for much interactivity, other than clicking on links to go to new pages.  Over time, things have changed.  Websites are becomming more interactive.  Websites are becomming applications in their own right.  Websites are offering audio and video - movies - and the user is able to interact with the video as well.  This is an example of a richer user interface, a richer set of controls.

These richer interfaces make it easier to use the application and to find what you need on a website.  The presentation of data and information can be customized to the user, and to various other aspects of the application.  We are moving to the notion of web applications instead of simple web pages.  However, the richness of a website application can also relate to aeshtetic features that make one website different from another.

I’ll be discussing and presenting a number of different Flex applications in subsequent articles.  There also are other tools and methods for presenting and creating Rich Internet Applications.  My first set of follow-up articles will focus on Flex.

I am finding the text “Beginning ASP.NET 3.5, In C# and VB” published by WROX to be a rather straightforward way to present and introduce ASP.NET with Visual Web Developer.  I am going through each of the chapters to get familiar with using the Microsoft Web Development environment, aka IDE (Integrated Development Environment).  As a web developer, I feel it will be very valuable to have a wide range of skills for offering, designing and developing web applications.

The Microsoft Visual Web Developer Environment is very comprehensive.  Very few similar tools for web development offer such an extensive set of features and encapsulate the ability to code in so many related technologies.  Dreamweaver by Adobe does come close to this, however, and it may be possible with the inclusion of various extensions to have the same functionality within Dreamweaver.

The topics I studied today mainly involve working with the Visual Web Developer tools for CSS design.

Recently I have been following the Training title “ColdFusion 8: Beyond the Basics” with David Gassner, published by Lynda.com  Today I have been learning about working with ColdFusion and external data services.  This began by covering how ColdFusion can access and parse XML data.  Using this information a data collection in XML format can be accessed and presented on the screen.  One example, might be to loop through repeating xml child elements that contain child elements themselves, presenting the information using one row for each repeating xml child element for the structure.

Later we took this knowledge along with information on how to access RSS (Really Simple Syndication) data to repurpose it for our own applications.  Using the cffeed tag, we can access data that is in RSS format - an xml format - or write to an xml format such as RSS, making it easy to create an RSS feed from content on a website.