Archive for the Category 'editorial'

My Blogger Code

My blogger code is B9 d+ t+ k s u+ f i+ o+ x e+ l- c+

I got it here http://leatheregg.com/bloggercode/. Get yours.

One (movie) to watch out for

Well, not watch out for, but go find. Because it seems like no one actually got to see it when it was “in theaters” or even noticed that it was released on DVD this past February.

This flick I’m talking about is 2006’s Idiocracy, and despite the efforts of 20th Century Fox to make sure that I didn’t get to hear about this gem, Mike Judge appears to have done a fun job of poking fun of Brands everywhere.

Here’s a full review of the movie.

Idiocracy - Being a Dick

Why Does Hiring Always Come Last?

With the amount of time spent on putting together pitches and proposals, doing existing client work to pay the bills, and then maybe working on internal projects, why does it always seem like the reason I’m so busy is because I need to hire another guy (or gal) or two to give my department a hand, but I never have time to actually get people in here for an interview?

Could someone please let me know how I can actually manage to do it all?

Time, Money and the Persuit of Happiness

So I’m sitting on the Acela train from Baltimore to NY trying to work on my laptop with as steady of a hand as I can manage with all the swaying and shaking this “the future is now” train is throwing at me. I started thinking a bit about the direct and abstract relationships we have with time and money. If I were to not stand outside and have a cigarette at 1:15, I could have paid $85~ and arrived in New York at 3:50pm. However, I wanted to have a cigarette, and spend less time on the train, so I instead elected to spend $135~ to leave at 1:30 and get in a 3:45… how does that make sense?

If the initial value of the entire trip is worth $85, a 20 min reduction (my math is terrible but lets say) a 1/7th or so reduction in time is then worth an additional $50? I must be crazy. It’s not even like I have Wifi on the train and won’t have to wait till I get back to the Ultra16 offices until I can actually post this anyhow. So here’s where the thought went.

When writing a schedule and outline for a project, if a client has $30,000 to spend, any agency will figure out how to spend it, regardless of the hourly rate that they bill out their employees at. The scope of the work (scope is a whole topic in and of itself) will be set, get changed and become adjusted based on the client’s available funds whether they go up or down. The first priority is to always make sure the client’s business requirements met, but the attention to actually delivering what can become a successful project seems directly relational to their budget.

The History

When I was living in upstate New York, and freelancing for any gig I could get just to keep a roof over my head, yeah, I’d throw together something for any client who had the couple of bucks that I desperately needed (within reason). But since none of those folks ever had the kind of money that I could use to hire one or two other guys with, they bought whatever time of mine it took to spend the money. Cool you paid my rent, alright, I’ll see what I can turn out for you in two weeks time. Some of these projects involved full custom CMS development as well as creative, and of course I did all the production work as well. The amount of hours I spent on these projects were never reflective of what was put together in the proposal or the actual project “schedule”. If I wanted to charge what would have actually been a fair rate, and bill for my actual hours (or even close to my actual hours) I wouldn’t have been doing any local business at all. One thing I did do, is never adjust what my rate was on paper, I would only fudge my hours to stay within budget.

When I was in this survival mode, the relationship between time and money was a dirty dirty one, because it had to be. I always gave clients whatever I could since there was/is so little money in that region to go around.

Ok let’s get back to what I’m really trying to talk about, “real” clients, “real” projects, and “real” money (in the context of a modern creative and interactive services agency operating in a metropolitan environment with metropolitan overhead).

I’m sure that you’re thinking… well there are good agencies and not so good ones, and that’s why some agencies produce better work than others. I honestly believe that isn’t always the case, I think successful projects are primarily based on two things… one is a concept, and the other is an approach.

The Concept

It’s always been difficult to find good people when you need to hire folks, and too hard to let people go when they’re not contributing to a company at a capacity that you require.

It’s rare that I see a portfolio that impresses me, let alone comes even close to blowing me away. So more than what opportunities a job seeker has already had, I look at potential hires in regards to what they’ve done with what they had, and just as importantly, their attitude and outlook.

When you hire good people who REALLY care about their work, and are passionate about what they do (or haven’t yet had the opportunity to do) they usually have a lot more to contribute than a senior level freelancer who looks at you as just a couple grand in their pocket, and don’t care about your business in the long run at all.

The Approach

Spend your money on purpose. Keep people happy. Make sure that your departments are comfortable with the amount of time they have for their contribution to a project. If you development team says they can get it done in 220 hours, give them an extra week, and ask them to not necessarily spend extra time on QA, but to do whatever they need to, to be happy with their work. Maybe do something a little extra, so they can find pride in it… whatever. When a client says, I have a little more time, or a little less money than we were initially talking about, compare it against your “badassness of a project” matrix and spend your money internally on what is going to allow to deliver the best work you can.

Good client management is hard to come by, and for the sake of having a relationship in the first place, initial conversations with a client that don’t make their way to paper, usually come back to slap you in the face when the client tells you “but we wanted this, don’t you remember us telling you?” or “we totally forgot about this, so you’ll have to do it for us as well”. It’s not an automatic slap. But when clients run free, and can’t be told “NO” additional costs become commonplace instead of the exception.

Going back and forth about the deliverables always take the steam out of any team that is otherwise excited about what their doing. By spending money or someone on your team who can actually keep that in check, your designers won’t complain to you about having to do busywork or backtrack, your developers will be able to stay focused on their work, and as an agency you will find yourself with happier clients and more successful deliverables.

The Irony (or The Lesson)

It seems like the best executed projects come from a passionate place. The huge budgets don’t necessarily return the best quality work. Only once people start to catch on to this fact will competition in the pitch wars be a lot more rewarding. I’d love to be able to say, “We’re going up against so-and-so for this project, and I can’t wait to see what happens” instead of “I hope we get the work.”

hooray for oopyjs!

Jonathan Snook over on Digital Web wrote a lovely little article on what i like to call Oopy (Object Oriented) JavaScript. Oopy JavaScript is much over looked subject for most folks unless they write their own library, extend someone elses and/or happen to know what they're doing in general. Writing JavaScript in an Object Oriented way requires a slightly different approach over Java or other typically Oopy-friendly languages simply do to the fact that Classes are not specified for ECMAScript v3. Macromedia when releasing actionscript 2 jumped ahead of the game by providing much needed class and namespace implementation. where as with JavaScript, we basically have to fake it by using wrappers to keep our object references organized.

Jonathan goes to talk further about the use of prototype property and other than letting us create references to the guts of an object's template, it reduces the risk of memory leaks due to the browser being saved from having to duplicate any objects needlessly.

We can add to the template’s prototype at any time, and the new properties will automatically be available, even on object’s we’ve already created. Let’s rearrange the last example to demonstrate:

CODE:
  1. function Animation(element){
  2.    this.animationLength = 30;
  3.    Animate.element = element;
  4.  }
  5.  var animateLogin = new Animate(loginform);
  6.  
  7.  Animation.prototype.onStart = function() {
  8.    alert("The animation is beginning!");
  9.  };
  10.  Animation.prototype.onEnd = function() {
  11.    alert("The animation is ending!");
  12.  };
  13.  
  14.  animateLogin.onStart();

Even though we create the new Animation before we define the onStart and onEnd methods, we can still use them! This is a huge advantage of the prototype-based approach.

So alright kids, get crackin!

monster’s new instant job search beta

Since I'm currently job hunting, a few times a week I bounce around between the different job sites out there to see if there are any decent opportunities close to where I live, or if I do actually have to commute to NYC to find good work. Today I was checking out monster after persuing a lead that made it's way to my Inbox early this morning to discover Monster's new Instant Job Search.

The Instant Job Search is a simple ajax app that lets job seekers do basic keyword searches of available jobs on the fly, without the use of a submit button. You specify your zip code, and search radius, and get results sort of quickly (avg. search time for me was between 2-5 seconds, not blazingly fast by any means, but quicker than a page refresh of course. I quickly typed in "Ajax" to get two listings of the same job for a .NET Developer in Connecticut. Well I'm not a .NET guy, so I expanded the radius from 35 to 70 miles (which includes NYC of course) and got 12 returned results, most of which I can work with.

Some interesting findings

This new little app works like an auto-complete and begins searching once you type in two characters in the Keywords field. As I said before there isn't a submit button, so it seems like every time you add a letter, it sends a request. And when you enter another character, it cancels that request and replaces it with a new one. So this is my quesiton. What's the point of this app? By sending requests with each keystroke and trying to return any data any chance it gets, theoretically if a user types slowly and is a hunt and peck type, they could actually using more bandwidth than if they had a page refresh since the server is returning more than the typical auto-complete string array.

Json meets AHAH

Ok, I'm sure you're saying "what's the big deal?" It's just lightweight data and folks who hunt and peck will never notice. And I'll agree with you. The WTF is what's returned by the server when you run your query, a line of JSON then some AHAH style HTML. Huh? Here's my query.

HTML:
  1. http://my.monster.com/JobSearch/InstantFeeder.aspx?_location=12528&_keywords=ajax&_radius=70&_sort=rank&_pagenum=1&_pagesize=1

And here's the JSON / AHAH hybrid that was returned

HTML:
  1. {"jobs":{"returned":12,"found":22,"pagenum":1}}
  2. <table class="ijsResult" id="ijsresult_1" xmlns:fo="http://www.w3.org/1999/XSL/Format">
  3.   <tr>
  4.     <td style="vertical-align:top;">
  5.       <span style="display:none;" id="ijsmeta_1">{'jobid':46098442 , 'positionid':36388017, 'displayoptions':}</span>
  6.       <div class="colItemNumber">1.
  7.         <br /></div>
  8.     </td>
  9.     <td style="vertical-align:top;">
  10.       <div class="colDetailedDateActive">
  11.         <span style="display:none;" class="colApplied" id="ijsapplied_1">A</span>
  12.         <span style="display:none;" class="colFiled" id="ijsfiled_1" onclick="IjsEvent({etype:'delfromfile',value:1});return false;">F</span>7/25/2006</div>
  13.       <div class="colDetailedJobTitle">
  14.         <span style="display:none;" id="ijsstar_1">
  15.           <img src="http://media.monster.com/mm/usen/icons/10x10_arrow.gif" border="0" alt="" />
  16.         </span>
  17.         <a href="http://jobsearch.monster.com/getjob.asp?JobID=46098442&amp;WT.mns_pth=1001" target="_blank">Java Developer with XML and Web Services exp</a>
  18.       </div>
  19.       <div>
  20.         <span class="colDetailedCompanyName">CyberCoders</span>  <span class="colDetailedLocation">Harrison, New York</span></div>
  21.       <div class="colDetailedSummary">Java developer for exciting Software Company This position is open as of 7/26/2006. Not a fit for this position? Java Developer with XML and Web Services exp   Location    ...<a href="http://jobsearch.monster.com/getjob.asp?JobID=46098442&amp;WT.mns_pth=1001" target="_blank">[more]</a>  <span class="colSaveToFile" id="ijssavetofile_1"><a href="javascript:return false;" onclick="IjsEvent({etype:'savetofile',value:1});return false;">[save to file]</a></span></div>
  22.     </td>
  23.   </tr>
  24. </table>

Pretty weird eh? Every time results are returned there is a parsing error due to syntax issues with the JSON string. And then other errors related to various DOM issues ie. "uncaught exception: Permission denied to set property Window.status" and "Error in parsing value for property 'right'. Declaration dropped."

What I don't understand is why the use of a hybrid return data set in the first place? All of the XHTML is formatted in the same way so why bloat things up with the redundant code? That same data could be in XML or JSON and be totally trimmed down. Below is an example of a JSON version of the same data. The JSON string equates to 592 bytes as opposed to the HTML version that is a much heftier 1,749 bytes. You get the point.

JavaScript:
  1. {"jobs": {
  2.     "meta": {
  3.         "returned": 1,
  4.         "found": 22,
  5.         "pagenum": 1},
  6.     "result": [
  7.         {"jobid": 46098442,
  8.         "positionid": 36388017,
  9.         "displayoptions":,
  10.         "itemNumber":1,
  11.         "ijsapplied": "A",
  12.         "ijsfiled": "7/25/2006",
  13.         "detailedJobTitle": "Java Developer with XML and Web Services exp",
  14.         "detailedCompanyName": "CyberCoders",
  15.         "detailedLocation": "Harrison, New York",
  16.         "detailedSummary": "Java developer for exciting Software Company This position is open as of 7/26/2006. Not a fit for this position? Java Developer with XML and Web Services exp   Location    ..."}]}

How to make a beta annoying to debug

Three words, lousy code formatting. The javascript errors took me to this line

JavaScript:
  1. return"";},SafeEval:function(s){return eval("["+s+"]")[0];},CookieGet:function(ckey){var carr=document.cookie.split(/\s*;\s*/);for(var nvk in carr){var nvsplit=carr[nvk].split(/=/);if(nvsplit[0]==ckey){return nvsplit[1];}}

Coding grammar

I can't stress enough the importance of well formatted code. When you are writing in any language, english included, poor formatting equals improper grammar. Thissentence,isinenglishandcanberead!eventhoughitisnotnaturalYadig? If a highschool student wrote a paper that was difficult to read, they'd get a lousy grade even if it was the most most amazing piece of work in the entire history of literature. The same applies to coding. Yes, when I typed in my query the app returned the results I was expecting. But from such a large company as monster.com, I was hoping for more.

unconscious vs. conscious interface design

I just recently discovered Justin Palmer's blog Encytemedia. About a month or so ago he wrote an article about Unconscious Interface Design as defined by Marco Dorante.

Basically, unconscious design is design where there is no “conversation with the situation”. Sometimes we make design decisions based out of habit; we are simply following the norm; or we just never asked ourselves “Why?”. Every design decision we make should involve us having a “conversation with the situation” if we wish to break free of unconscious design.

He goes on to talk about examples of unconscious design in the Wordpress admin interface which got me thinking about all of the bulk information that I don't really need to see every time I login in to add a post or do whatever. Has anyone else been interested in revamping the wordpress admin? I'm not concentrating on look and feel, but actually putting together an "admin admin" that lets the user decide what information they want to see on each page as they manage their blog. If so let please let me know by either leaving a comment or emailing me directly.

doing simple things without a code library

So I just was reading this article written by David Talbot on Devx.com about Yahoo's UI libraries aiming to make crossbrowser development a bit easier for some folks.

The only notable feature that I could seem to find, was the simplification of setting the opacity of a DOM element in an elegant way. An entire library for that? I got a little curious and took a further look.

Here's an exerpt from the artile:

The DOM and Event Libraries
YUI's capabilities in regard to core DOM and event handling are incredibly rock-solid, perform as expected, and cover a broad range of capabilities. Most surprisingly, this API gives you simple cross-browser transparency control. Most developers aren't even aware that magic tricks even exist (via DirectX calls) to make semi-transparency work in IE, much less the Mozilla-based equivalents, but YUI enables access to most, if not all, of the CSS properties you'd ever want. Here's an example:

YAHOO.util.Dom.setStyle('MyDivID', 'opacity', .5);

Suprizingly? Are you kidding me? Maybe I just don't get what the big deal is. I've been developing crossbrowser DHTML in one way or another since the beginnings of the last browser wars. And back in 99-2000 when everyone was bitching about the diversity in W3C support between the version 4 browsers, I was just doing what needed to be done to make everything work the way it needed to.

So despite Mr. Talbot's enthusiasm for what I considered to be not much of a big deal at all I headed over to Yahoo's Developer Center poked around their lousy documentation and downloaded the most recent build here on Sourceforge. I took a peek at the source, and it turns out that Yahoo and I have almost the same exact approach, thing is, running their entire library is pretty needless.

Here's what I came up with to put together a fade in effect for the items being loaded into my portfolio via xmlHttpRequest.

here's the very simple browser check:

JavaScript:
  1. var ua = navigator.userAgent.toLowerCase();
  2. var isOpera = (ua.indexOf('opera') != -1);
  3. var isIE = (ua.indexOf('msie') != -1 && !isOpera);

and here's an exerpt from my getPortfolioDetail function:

JavaScript:
  1. xhrPortfolioDetail.onreadystatechange = function() {
  2.     if (xhrPortfolioDetail.readyState == 4 && xhrPortfolioDetail.status == 200) {
  3.         portfolioDetail.innerHTML = xhrPortfolioDetail.responseText;
  4.         var fader;
  5.         for(count = 1;count <= 10; count++){
  6.             fader = setTimeout(function(){
  7.                 val = count*0.1;
  8.                 if (isIE && typeof portfolioDetail.style.filter == 'string'){
  9.                     portfolioDetail.style.filter = 'alpha(opacity=' + val * 100 + ')';
  10.                     if (!portfolioDetail.currentStyle || !portfolioDetail.currentStyle.hasLayout) {
  11.                     portfolioDetail.style.zoom = 'normal'; // if you use '1' it distorts things
  12.                 }
  13.             } else {
  14.                 portfolioDetail.style.opacity = val;
  15.                 portfolioDetail.style['-moz-opacity'] = val;
  16.                 portfolioDetail.style['-khtml-opacity'] = val;
  17.             }
  18.         },100*count);
  19.     }
  20.     xhrPortfolioDetail = null;
  21. }

Pretty simple eh? One thing that you can't see is where I use the same approach to lower the opacity to 0.1 while loading, so there isn't any flashing of the loaded content before it fades in.

I know that there are tons of AJAX Frameworks out there that provide fade in type effects, but I'm not quite there on implementing one. Noteables include Dojo, MochiKit, and of course the ever popular script.aculo.us.

I'm still working on making it work a little more smoothly and efficient as the delay in setting the opacity while i'm doing the xmlHttpRequest is inconsistant at best.

is Spry the way to go?

Framework this, framework that. RoR or CakePHP? bah, what about somthing else? Well Adobe Labs has introduced the Spry Framework for Ajax prerelease 1.1. And their demos look pretty good.

Photo Gallery
Photo Gallery
Product Table
Product Table
RSS Reader
RSS Reader
The release addresses issues reported by testers since Spry first came out. You can find the change log here, the overview here, and find the download here.

Even though Spry's UI effects make it quite attractive for my playful and easily distracted side. I wonder how it would hold up with my use of XHTML return data instead the clientside XML parsing that i talked about in this previous post.

Similar Posts

Categories

Archives

About

Nater Kane is freelance developer and user experience & technology consultant based in Brooklyn, NY.

Nater's focus is on creating a semantic and accessible web, and having delighted clients with happy customers.

He likes to spend time playing with his cats, playing drums, working on his diesel vw rabbit and his motorcycle, and enjoying a decent espresso.

RSS

Twitter » What I'm Up To

How I'm Social

Basecamp

Meta


Nater Kane naterkane personal http://www.naterkane.com LinkedIn Profile Web Technologist personal nater@naterkane.com 1978-09-12 voice 845.234.6698 | fax 707.922.0593
964 Flushing Ave. Brooklyn, NY 11206