Legacy Systems - Maintaining Old Customers by Maintaining Older Computers?

I am in a bit of a quagmire … My PowerMac G4 is on it’s last legs. It’s not really a surprise considering the computer is 11 years old now (purchased in January 2002). The computer was my primary system through my undergraduate college years as I was beginning work as a freelance graphics designer. I have been maintaining the system in part as a backup design rig (which it is no longer viable as), and in part to maintain software for older projects. Over the years the web has gone from simple markup driven pages with images, video, and some Flash interaction to advanced program driven sites and web applications making these older web projects completely out dated and out mode-ed.

I have come to the realization that only a few of my clients are having me maintain their older web sites (pages that were designed using HTML 3.5 and 4 using Adobe LiveMotion for Flash animation), and have  come to the conclusion that it might be time to move on. Sure I am using much more modern Macs and way more modern software, and these updates are few and far between. Sure I can maintain the HTML, but the LiveMotion files need a legacy system like my PowerMac G4. Right now I am torn between the needs of those very few customers and the needs of my business. do I purchase another computer to use as a legacy system, or do I place the funds into replacing other computers, like my old 1st generation 17” MacBook Pro (the computer I use at my drawing table for reference materials).

The cost of maintaing a legacy site is less than the cost of a legacy system, updating the sites to current specs is technically a loss more than the cost of the legacy system, but no where near the cost of a new Mac Mini. Plus the new Mac Mini will increase my capabilities because I will have an updated system to view my reference materials, serve media, and to use as a web server for site testing. 

Ok … so here is the idea. It is all down to basic math. If your clients legacy based websites do not generate enough income to maintain the older legacy hardware, let alone replace it then there is no point to maintain the older equipment.

Kind of simple really. I would rather lose a little bit of money updating a client’s site redesigning older formatted files in Flash or Java, than lose money over the long term maintaining an older computer.

So quagmire solved by basic logic.

Information Cycling - Just How Long is Information Relavent

Just how long is information relevant? How often should I update my Blog, my Facebook feed, or my Twitter Feed? These are questions that media designers and communications experts ask all the time. Information has a certain range of efficacy, and that changes by the type of content, who the receiver of the content is, and the size of the target audience. 

Ok … to make this simple you are a writer, and you are writing a Blog novel. that means that you are writing a story by chapter and posting the chapters of the story monthly, and the plot ideas and character discussions are being posted daily. The efficacy of the plot ideas and character discussions are minuscule in comparison to the actual written chapters of the story. In fact readers of the Blog will sometimes ignore the ancillary information just to get down to the story, and refer to those posts only when they become curious about a specific character or plot line. The efficacy of the story chapters is only limited to the stories popularity and the writers will to pay the hosting bills. 

So stories are just one aspect, let’s change the scenario. You are running an independent news website, and you are writing and posting articles of a news-ish nature. News has a short term shelf life, and is only relevant while it is still news. Later it may become information that is valuable as reference material to other writers, so it actually has 2 periods of efficacy, and they are both short based on the necessity of the information.

One more scenario. You run a store’s Blog and you are responsible for posting information on new products and the various specials the store has. You post an advertisement in your blog  for a “50% off sale - this week only”, and the advertisement is undated (don’t ask me why, but I see advertisements like this all the time). The obvious efficacy of this information is only for the week of the sale. There really is no continued use for the ad. Plus because the advertisement is undated it should probably be deleted from the blog to avoid the confusion of your customers.

I know some of you are scratching your head trying to figure out what the point of these examples are (and many may be saying “I already knew that”), but the examples show how information is temporally usable when the reader deems it necessary. Sure news based information is needed now so it has a short efficacy (unless the work is being used for research), but literary works have a much longer life span based on the popularity of the work, and some material should only be accessible for a short time and then deleted like time specific sale advertisements.

As for Blogs, Twitter Feeds, and Facebook, think of them as a rolling feed (much like news sites which were some of the pioneers of Blogs and Streaming feeds - even though many of them would argue that their system is not a BLOG). The newest information is front and center on the home page, while older news is cycled further down the page. So there is no need to delete articles out (so the only cycling that really needs to occur is the natural posting of new stories as needed). The real question becomes time. So what is a good interval to post? It all depends on what you are trying to accomplish. 

If you are running a business who is using social networking as your means of marketing then you are going to need to spend a reasonable amount of time on social networking. That means that you are probably going to be posting to Twitter and Facebook allot to get your products and services out to the people that are subscribed to your feeds. The same is true with Blogging. You are going to want to post small Blog pieces several times a day. Over the years there have been some smarter Blogging systems like Tumblr and WordPress that link to short blurb feed services like Twitter and Facebook. Using these feed based services can cut down your posting workload considerably. 

If, however you are small business you may not have the time to spend on social networking then you may want to utilize a Blog because you will only be able to get in one or two posts a day. These posts should be as informative as possible providing your customers and future customers with the relevant information they need to know. 

If you are an individual, then posting whenever you get a chance, or whenever there is something you want to communicate is the general norm. In this instance data cycling doesn’t come into play because it is casual indirect communications with your family and friends.

Remember In this day and age Information Cycling happens on it’s own. So it is not something that you have to micro manage unless it is time sensitive information. So information is relevant as long as readers feel that it is.

Planning and Logistics In Web Design

Logistics is defined as ”the detailed coordination of a complex operation involving many people, facilities, or supplies …”. This is all well and good if we are talking about physical objects, but information is just that, and in this day and age information is tangible and intangible, accessible at a moments notice, and ready whether people are ready for it or not. 

The point to web design is to provide information in the form of text, audio, images and video to the electronic world. To provide this media in these modern times it takes planning. Ok … for a designer this seems all counter intuitive. Designers are spontaneous and they pull their ideas from their gut instincts, their creative eye, and their artistic brains. That’s all well and good, but the web, which can be a creative endeavor is there to provide information at a minute moments notice based on the whims or direct needs of the viewer. If information is not usable or easy to access then it’s useless. Often times websites are hard to use and illogically organized making their purpose pointless. Also there are times when sites have inconsistent user interfaces or designs across the many pages of the site making these sites functionally troublesome.

To keep a website from becoming functionally useless it takes cooperation between the client and designer, information and planning.

I actually have a list of questions I ask before beginning a project:

1. Who is the client?
2. Who is their audience?
3. What is their audience expecting?
4. What is the scope of the project?
5. Does the client have a current web site?
6. What is the client’s style? Color Choices? etc …
7. What does the client want to change in their style?
8. How many pages does the client need?
9. What services does the client’s site need to provide?

This is where logistical planning comes into play. With the information provided by the client plans can be made to develop a website fitting all of the needs of the client and their customers. The first step is focus on the goal of the clients website. Keeping that in mind the next step is to contemplate what the customer needs. If the client is looking for a basic web-store to sell a few hand made goods then a basic store with a few pages and a PayPal cart system will do the trick. If they need a large store with a back end I will usually usually consult on a service, or contact a web developer I trust to create a back end. Once the plans for storing and back-end services are made I will move onto the design of the site. I usually will place myself in the role of the site’s visitor or customer, and I will contemplate what features the user interface needs. Next I create a basic wireframe design of the site (recently I have been using Adobe’s Proto). Then I tree diagram the site’s structure. Next I use Adobe Collage to create an idea moodboard for the site. Then I work up an estimate for the site to send to the client (and wait for a reply). Finally I create a mockup of the site (and again wait for a reply). Then I build the design for the site, populate the pages, link the pages to the back-end if necessary, and the site is completed. 

Without planning the site out, and considering the logistics and user interaction of the site no website can be successful, and a designer will fail the client (something that recently happened to me). Sure it takes allot of time, but it’s well worth it.

Contemplating A Reboot

I once wrote that the web is constantly changing in little tiny baby steps. Well ist still is, and the next step in design is really nothing more than a methodology shift. For the longest time web pages have been designed using a specific width. This isn’t really a problem for desktop computers or iPads, but it is a problem for handheld computers because the resolution of those devices is much smaller horizontally. Responsive web design provides a fluid design methodology that allows sites to adapt, look, and function on all devices equally well with some smart programming methodologies and the new abilities granted by HTML5, CSS 3 and a few neat Java tricks.

As I learn this methodology it makes me want to take my site back to the framework and build the new site up from there. Basically a reboot. Something I will begin working on here in the next week. I am also working on new portfolios for my site that will work with all the newer responsive web technologies. I can’t wait to see how it will all come together.

The Concept of Rapid Prototype Design

Building websites used to be about sitting down with a piece of paper and pencil blocking out the content areas, figuring out the dimensions for the tables in the layout. Once the rough idea was completed the designer would open Photoshop, and build a wireframe with the rough artistic elements as a preview for the client. After a client approved the design it was off to a web development suite to create the site. That’s been the process of prototyping websites that designers have used since the 90’s. Technology has moved on and now there are several tools for designers to organize ideas (like moodboards covered in a previous article available here) and rapidly prototype websites and get actual usable code for the site development.

There are several rapid development tools available to graphical website designers. 

We can start with Adobe InDesign. In Design can allow designers to create quick layouts with filler content, add vector created images, then export them to HTML where the work can be completed in web design software. The problem is that the code is really meant not to be used as a framework, and can only be used in the direct development process on a page by page basis.

There is also Adobe’s Proto, an iPad app that is designed to create rapidly developed wire frameworks for website designers. The frameworks can be exported in HTML and CSS where the work can be completed in web design software. The added benefit to Proto is that you can do the work from anywhere on an iPad. The possibilities for rapid prototyping are pretty much endless because the software produces the HTML and CSS using industry standard code allowing Proto to fit into about any web design suite (obviously Adobe’s Creative Suite, The Escapers Flux / Lucid system, and Microsoft’s Expression Studio). The major drawback is that Proto cannot import images or text elements into the layout, once the wire frame is completed mockup needs to be completed in web design software.

Then there is The Escapers Flux / Lucid system which allows you to quickly develop wire frame sites and quickly develop advanced CSS. Flux and Lucid are really rapid development tool. which means that you can utilize it for prototyping, then move directly into design which can save time and money. Lucid can even allow graphical web designers with a little JAVA background build advanced page animations into a site which can help impress your clients.

Finally there is Softpress’ Freeway. Freeway is a web design system developed for programmers and designers alike. It provides a page layout-like interface that allows the adjustment of layout elements and typography while providing advanced coding tools for programmers. The software can import files from many top end image editors like Photoshop, Illustrator and SketchBook Pro. It generates CSS and standards compliant HTML, but it only exports to HTML 4.1 or XHTML 1, and CSS 2.5.

For my design purposes I have found that various combinations of these programs have worked their way into my development workflow allowing for prototyping and rapid development method of a site to change based on the project itself allowing for the best efficiency in development.

The Purpose of the MoodBorad

The general idea of a moodboard is to use it’s collage function to help generate ideas for project development. In the concept of web design For the longest time I used a program called Moodboard Pro for my iPad. I used to use it all the time to develop color pallets and design ideas for the various projects I was working on … Regretfully Moodboard pro decided to fail. I had to switch to Adobe Collage which provides on-line syncing services for Adobe Software.Collage works very much like Moodboard except that I cannot choose a color pallet. As I begin to develop more advanced and creative sites my iPad and Adobe Collage will become more integral to that process.

That’s the whole point to a Moodboard. It’s the starting point and the collection of media. Consider it a cork bulletin board only digital. You pin little scraps of ideas to it, collect them, refine the ideas, do it again, and again, then create using your normal creative methodologies and tools.

Short of the old fashioned methodology (the cork-board method) there are actually only a few good applications for creating moldboards on a computer. The nest ones are available for the Apple iPad.

If MoodBoard Pro will work on your device (yes I know that I said I was having problems with it, but not everyone is) it’s the best application to work with. It provides all the tools necessary to create idea collages for projects. It’s relatively convenient and can help you quickly combine ideas and even choose color swatches for your project. The app can be a little slow though, and has a tendency to crash on occasion. Adobe Collage on the other hand is fast and streamlined, allowing the user to quickly structure ideas and pace them on the board. It’s use of Multi-Touch is inspired, and it’s ability to automatically sync to the Adobe Creative Cloud means that you have the ability to export a project to your computer in the industry standard Adobe Photoshop file format (which is currently the big draw and deciding factor for me). Either way you will find these apps helpful if you are a creative designer needing a place to combine ideas that is small enough to take with you.

Being A Client - Things learned recently from dealing with clients

As a graphics designer I occasionally come across a client that either does not know what they want, cannot describe what they want done, or they they don’t understand the complexities of website design (like thinking that their 100 page tribute site to The Who is a simple website that will only take a day or two … no joke … really happened). So here are some tips to help clients prepare to work with a professional designer.

Plan ahead

If you have an idea of what you want your website to be, and how you want your website to look it is probably a good idea to jot down those ideas. Using a block sketch. photos, patterns, and color swatches (which you can get from the $8.00 My pantone app on many smart phones, or at your local Lowe’s or Home Depot) can help a designer determine what the web site will look like. In addition other websites can be used by the client to help illustrate and provide a foundation of what you want the designer to create.

Now that you have the design ideas out of the way you need to get down to the specifics of what the website is going to be. If it’s a store, and you hire a designer saying it’s going to be a basic simple web site, he designs a basic template and tells you it will take between 10 to 15 hours to complete, then you hit the designer with your 200 item product catalog the designer is going to need to re-plan the web site from scratch. The reason for this is that a simple 200 page (1 page per item) is logistically a large store scenario. On estimate it takes between 15 to 20 minutes to copy, paste, adjust the look, and place photos in a hand made PayPal based store page. That’s 67 hours straight of mind numbing work. Planning the logistics of this particular example would lead a designer to suggest a web-host with a store back-end which will reduce the workload greatly. 

There are backend services for all sorts of web sites. If you are planning a site with allot of content, then building a site around a content management system (a system used to manage artwork and text content). If you are planning a BLOG then a blogging backend would be beneficial … etc.

Ask Questions, and Prepare to Answer Questions

Prepare a list of questions.

• How much will it cost? 
• What are your hours of operation? 
• How can I contact you? 
• Can I see examples of your designs? 
• Is there a deposit required? What is the Process for publishing a site? 
• Where will you / I get content for the site? 
• How long will it take?

Questions like these will help you get a grip on what the site design process is, and what you need to provide to the designer so they can do their job.

On that note a designer should ask you about the logistics of the project (something I really need to do more often). You need to provide the most correct answers possible so the designer can plan out the project and do the job in the most efficient way possible. Some of the questions may be:

• What colors will the site be?
• How many pages?
• Do you want any animation work done to the site?
• Are there any specific deadlines to meet?

Perspectives and Opinions Vary

Sure you say that you want a simple website, after all, web development is so simple that even your nephew can do it … right … Well not really. Sure many people can design a website, but few can do it well. I consider a basic website to be between 1 and 20 pages following a simple theme with maybe 1 or 2 animations in the project. I have had clients who feel that a basic website is a complex fan-site blog with advanced animations. As a client you need to understand that your grasp of a simple project may not cover all of the logistical nightmares for producing a site that meets your requirements. So for that you need to ask a designer what he thinks the site will need, and time tables required to make the project work.

Be Patient

Finally, you the client must be patient. Things may look ugly at first, may not function exactly the way you think it should, or it might be a little behind the scheduled deadline. Be patient, and work with your designer. As a designer I have dealt with my fair share of upset clients, and I have to note that calling a designer just to scream their ear off does not help anything, in fact it slows them down because they have to stop to listen to you scream at them over the phone. I have found that in dealing with sub-contractors a quick e-mail requesting the status of the project with a request for an ETA usually keeps the project on track, and provides the designer with a nudge to get the project done. I am sure that the same tact will work with the designer of your project as well.

Final Statement

Planning ahead, and helping the designer plan for your needs will allow the designer to do his job in a timely fashion, and will provide you with a properly designed functional website.

The Client / Designer Relationship

I have been a graphics designer for several years now. I have also been dealing with customer relations for much longer (working as a sales associate at an office supply store and a counter attendant at a mini-mart). The one thing I can tell you about customer relations is that when dealing with new clients it just never gets any easier. Clients usually want the world, and they really don’t want to pay allot for it. It’s the job of a freelancer to match the broader strokes of the design project with the amount the client is willing to pay.

For instance if a client is willing to pay $500.00 for an E-commerce web site then E-commerce hosting services (which usually costs $29.00 per month for a reasonable sized store, but in many cases it can cost $59.00 per month) are out of the question, and it all comes down to designing the store and using a payment processing service like PayPal. The problem with this method is that it takes an awful lot of design time and work to maintain the site and keep products updated. 

For a client that is used to the posh and feature rich services like Etsy (a store service for crafters) this is a massive change.

In other cases it might be animation projects that are well out of their price range, or programming projects for back-ends that are just not feasible (not that I do back-end programming projects). Clients are usually disappointed in the realization that they cannot have everything they want for the price they can afford to pay, and they will change the design 50 times, and add small projects to the site to get it closer to what they want. As a designer I can say that you need to be honest and explain everything to the client so they understand the creation process and work involved in the creation of the site. Also making them part of the creation process and keeping them apprised of the projects progress with quick daily updates usually keeps a client satisfied.

Kill Joy No Fun

My step-father is the ultimate kill-joy. Yesterday I got my driver’s license … Yes that’s right citizens of Mercer County you may want to start walking on the middle of the road because I will be driving on the sidewalks (lol ^_^). Well today my step-dad had a doctors appointment. Mom asked if I would take him. When he found out he nearly blew up. I guess he is not too confident in my driving just yet :-P.

The Wire-Frame Shuffel

Every time I build a wire frame of a site I think it looks good, then I come back to it a little later and I think “… what was I thinking?” right now I am doing that with Project D’s Project 2 (entitled Loop The Loop). I am contemplating a minor failure in the design dynamic cohesive (in english … each element looked good, but when put together it seems to fail. Now I need to review what I have designed and see if there is anything I can do to rectify the design. Check back soon because as soon as I can correct the design dynamic making it look more cohesive and put together. Any-who back to work.