Along with the redesign, I’ve unveiled the new logo for all things Mitcz. It’s something I sketched out about a year ago, but never got around to actually finalizing. Last weekend, I did. Last night, I finally used it somewhere.

If you’d like a closer look, here’s the semi-final Mitcz Industries (tongue firmly planted in cheek on that one) logo…

As for the blog – you’ll notice a few new things here, some enhancements, and obviously a whole new look. One of the best things about this new design is how much more readable the entries are. The line spacing, font size and color scheme really invite your eyes to keep going.

For years, I’ve wanted to project “evil…. but classy” throughout my projects / marketing, for reasons I’ll explain another time, and I feel like I finally nailed that goal with the current Mitcz.com design. I’m really happy with this new look, and it almost makes me want to redesign RevMitcz.com again. I neither have the time nor energy to do that right now, so it’s on the backburner.

Who knows, maybe this new look will inspire me to blog more often, too. We shall see.

Related posts:

1. ReLaunch : RevMitcz.com v3.0
2. New Mitcz.com
3. Mitcz.com, Redesigned and Reworked

Still, it’s definitely an improvement over what I had before.

Related posts:

1. Mitcz.com Redesign, and a new logo
2. New RevMitcz.com Frontpage
3. Mitcz.com, Redesigned and Reworked

“It’s another first for adult film companies that pioneered the home video market and rushed to the Internet when Hollywood studios still saw it as a threat. Direct download to DVD starting Monday.”

I actually was involved with this, almost a year ago, when I worked at Vivid. Much of my design changes have been retained, including the much-discussed “splash page” that transitioned users from CinemaNow to AAC. At the time, I suggested to Vivid that we develop our own, more-compatible-with-all-browsers-and-OSes version, but they didn’t go for it.

Truth be told, I wasn’t too pleased with the jackass way of handling things that went on at CinemaNow. They seemed to be way too wrapped up in company politics and horseshit buzzwords to get anything done on time. Take for instance that we had something like 5 boardroom conference calls just to decide which girl should be used for the splash page. No shit. I made more mockups for that site than I care to count. I should track down said mockups one day. Ooh.. I found my original mockup for AllAdultCash.com, the affiliate program that was supposed to accompany the new AAC site. Apparently, they’ve gone a different direction, entirely since then. Cool by me. I like the new one. It’s more “affiliate” lookin’. At the time, they asked for a much more minimal design so that’s why I made what I did.

Even though it’s taken well over a year to put together (after the whole thing was initially scrapped after the aforementioned bullshit politics got the best of everyone), and their system works with only ONE browser, on ONE OS, for ONE media player – I guess I’ll applaud. I don’t know why, but… sure, go for it guys. Maybe it’ll turn an extra couple of bucks and everyone will herald you as kings…… again.

That isn’t to say they aren’t deserving – my hat will forever be off in salute to Vivid, they’re good people and I think they’d still say the same about me. We parted on very amicable terms.

read more | digg story

Related posts:

1. Vivid.com : Goal, Completed.
2. BellaVendetta.com Launches
3. Design Issues Part 1 : Browsers and Related Design Ethics

BellaVendetta.com

The Bella gig hit me ’round about mid-January. My photographer friend Michelle Collignon told me a friend of hers in New York, “Bella”, needed her porn site redone. I took a look at it, and uhh.. well, here’s what it used to look like :

Not too pretty. Kinda thrown together, navigation from hell, incomplete (and totally non-compliant HTML 4.01, at best) HTML code was actually throw into the MySQL DB tables (if you know what this means, you’re cringing right now) – all in all a complete mess. Not to mention – 924px wide! That’s just insane.

When you’re going about a redesign, you need to look at what the site is doing right now that needs to change. You need to evaluate its strengths and weaknesses. That’s often much easier said than done. About the only thing the old site had going for it was its amass of content. Unfortunately, locked away in MySQL tables – it was of no use to me. Sometimes, as was the case here, you need to throw the entire “version 1″ away and start fresh. And so it was with BellaVendetta.

Personally, I like designing logos. I’m not altogether that great at it, but I like doing it. I feel like getting a good logo in place puts me on solid ground for imagining the rest of a given design. I can take from the feel of the logo, and I can see where to put the logo, and how the elements of a page can work with it.

Here are a few of the first-round logo treatments…

In the end, she liked this one best, so it became the official logo :

So, I had a beginning point. I had a logo started. I was ready to roll. I did what I always do with clients, I sent her mockups. She didn’t like a one of ‘em. They didn’t “feel” right. I agreed, but I couldn’t figure out why. Before I get into why this entry has any interest to a non-designer at all, I’ll show you those original mockups, then you’ll get the story of what happened next…

As you can see… kinda dark, but very “clean”. All the edges were smoothed, and/or rounded. There was a “gloss and sheen” to everything. Looking back, I see the problem immediately. BellaVendetta is NOT fuckin’ clean. Right. I get that now. I didn’t quite “get it” then. I work for Vivid, remember?

Something happened, though. A few somethings. Want a laundry list?

1. Mom called me to say she had cancer and might not survive multiple operations and months of chemo and radiation treatment
2. Girlfriend’s mother died and she broke off all contact with me to leave the state for a month and bury her, get away from it all, and “cope” with it.
3. The Scientologists, who owned the Celebrity Center directly behind my apartment complex, were moving us out. I had 2 months to find a place, pack everything up, and get the fuck out.
4. My workplace had denied me a much-needed raise after a year and a half of hard work.
5. …wasn’t getting sex from the girlfriend, but had to spend some 80+ hours editing frame-by-frame hardcore porn clips and making them “censored” by placing stars/obstructions over anything “pink” or nude on anyone in the span of 12 different 5-minute clips
6. Roommate had a busted arm, and couldn’t help move anything from one apartment to the next
7. I cried for the first time in 14 years
8. Girlfriend returned, unbeknownst to me because, as it turned out.. her mother was not dead. No, her mother was alive and helping her plan her wedding to her ex-boyfriend. In response, she said “I couldn’t tell you any other way”, once her friend accidentally tipped me off to the facts.

Most of that happened in about a week’s time. The last part.. about 2 weeks later, once I was just moved into my new apartment.

In making the site, I read the BV Manifesto. That was like a mantra to me. Don’t just get down and stupid about shit – fuckin’ get angry, fuckin’ channel that anger into your art. I was making BellaVendettaDOTFUCKINGcom. This wasn’t your mother’s pornsite. This was organic. This was real. This was borne of people tired of the mainstream, tired of shitheads bringing down the hammer, tired of being confined into society’s “safe” versions of our deepest carnal desires. This was the site without apology. Without censorship. I fucking owed it to Bella, to the site, to the models, to the viewers, to the fans… to the fucking world at large to put that energy into the site.

So I got drunk. Consistently. I was drunk for about 2 months straight. I tried drawing lines. They came out jagged. I said “fuck it!” and kept them (note the “bloody grass” at the bottom, that was me trying to draw straight lines). I tore apart the sides. I tore apart the interface. I added little hints of “classy” alongside the torn up remains of the once glossed-over lines, as a juxtaposition. It was to mock “happy” and “clean” by putting it alongside the ridges of whatever torn up shelter made it’s way into the shell of the side. Pink turned to the dull grey, and went dim and empty. Everything was cracked. Broken. Bloodied. Bruised. Like I was. I put my soul into that design, and into that site.

I owed it to Bella. She inspired me. She probably doesn’t know it, but she’s a hero to me. I sheltered my emotions, kept them locked up. I didn’t channel fuck-all into what I was doing before. She saved BellaVendetta.com from being “pretty” as I’d originally intended it.

The site took longer than I thought it would. It took.. all told, about 9 months. That isn’t straight work-time, however. I had to battle my personal demons. Bella battled hers. The models, some of them, dropped out or moved on or decided they weren’t “for it” anymore. I had to work long hours toiling over the battle between what was right for the site, and what was right for my sanity (and my sleep schedule). In the end, the site won out.

Here’s what I’ll always find amusing…

BellaVendetta.com is the most honest, uncensored, forthright pornsite I’ve ever seen and ever had the pleasure to work on. It’s a labour of love from ALL involved, making it the most intimate pornsite you’ll ever run across. Not a one of those models has been paid for their time. They love the expression, and the freedom. They’re all releasing their “Beautiful Revenge” on this society of cleanliness and “no, we don’t talk about that” people.

For all of our hard work, guess how many billing companies jumped at the opportunity to take Bella’s money..

Not a single fucking one.

So, she begged. She pleaded. She reasoned. She was completely ignored. Some of these billing companies had incest and rape fantasy porn – but said BellaVendetta.com was “Too Hardcore”. Did Bella buckle? Back down? Bite the fuckin’ bullet and say “ehh… people can do without necrophiliac menstrual art”? Not at all. Though the road was tough for her, and I spent many hours begging her to stay strong, for all of us, and toll on and move forth and for the love of all things with passion and integrity in this world just keep the fucking site up. Bella Vendetta was our pornographic martyr.

She lost what she considered a great lover (perhaps even two) in the process. In a time and place where she really needed that kind of moral support, they wanted to censor her and live a “normal” life with her. She could’ve given it all up, right then and there, and moved away to a small town into a house with a white picket fence and been done with it. While you might sneer at the mere thought of it right now, that idea becomes a lot more appealing when it seems the whole world is against you. She’s no stranger to struggle, but it gets tough to carry that ax for too long. Forced martyrdom, standing alone, isn’t a place I’d expect many people to relate to or deal with. But she did.

In the end, of course, she kept the site – all obstacles be damned. And, we finally found a billing company. She lost lover. I did too. I even went celibate. And Bella… well, she peed herself when that first member joined up. Knowing her, she prolly photographed it, too.

Welcome to BellaVendetta. Enjoy your stay. We’ve got a piece of your darkest secrets… just behind that door.

p.s. –
Bella..
Thank you. Hero.

- Love, Mitcz.

Related posts:

1. Notes To Self RE : NYC
2. Mitcz.com Redesign, and a new logo
3. Mitcz on your shirt – yes or no?

*ahem*

Vivid.com

Now, most of you know I work for Vivid. Or, more specifically, that I make their websites. So, why is it such a big deal that I just linked Vivid.com? Because, sirs and madams, that is the default page. Meaning that when you hear Howard Stern talk to the Vivid Girls, when you see a 50ft Vivid billboard in NYC’s Times Square, when you drive down Hollywood Blvd and see all the Vivid ads – the link they’re pimping will bring millions of people to my original work. That’s ALL me, baby. Conceived, Designed, Poured Over, Worked On, and Implemented by moi. I didn’t do every little piece of the back-end code (though I did do most of it), or the script that makes the header image randomly swap out – but the rest of it? All me baby.

This is a huge deal to me. Back when I worked at FetishCash, I remember reading an article in AVN Online (the magazine for adult webmasters) about Vivid.com’s launch. This was 2001. I said “goddamn.. what I’d give to work on a site like Vivid.com. They must have a team of.. 5.. 10.. designers, all huddled around mocking up interfaces and mulling over complimentary colors and what-not. Ahh.. what a thing”.

Here I am now, some 4+ years later, and I find myself as the Senior (and, sole, for that matter) Web Designer for Vivid. That’s the team that went into Vivid.com’s “guest” area. Me. In fact, I worked on it from home for about a month or two before I even brought it into work, because it’s such a radical departure from the “normal” Adult Website that I feared I’d never get past the drawing board unless my idea was fully understood. Making sure that idea was fully understood meant doing a shitload of work from home just to bring the concept across.

Because this is a big deal to me, and I’d like some place marked where I’ve written down all the shit I did to get this site where it is – I’m gonna ramble on about it. In the words of Ethan Marcotte, I’m going to “pimp my koolaid”.

I realize this is a lot of self-love and self-appraisal, so don’t read it if you don’t care. But, if you give a shit about the “inner workings” of things like design mockups, user-centric web design, and well… pornsites.. then it may interest you.

The Problems

For reference purposes, you can see the previous default Vivid.com tour by clicking here (don’t worry, I turned off pop-ups in that link so you won’t be getting slammed with shit).

Notice how long that post-warning page takes to load up. For bonus points, check out the “girls” page. Painful, no? That page is a hefty 300k or so. When we had two designers, which would make it myself and my friend Jim, he went through the trouble of optimizing the living shit out of that site. Unfortunately, it didn’t help a great deal. There’s only so much optimizing of images and code that one can do before the images start to look like complete shit. Not a good thing for a tour that’s supposed to speak volumes for our company and more specifically – our website.

Beyond that, you’ll notice little mention of things like the online Vivid Store, Vivid Personals, Vivid E-Cards, Vivid Screensavers, Vivid Live (our XXX chat site) and many other Vivid Ventures. There’s even Vivid Cigars and Vivid Condoms. Where would you find out about that, if not on Vivid’s one and only homepage? Nowhere, at the time.

Take into account, as well, that there’s very little mention of the sheer amount of video and images – even just of our own content – that one will get when joining Vivid.com. Few people realize that almost every Vivid film released on DVD is also released in its full, uncut length, on our website. So, you can stream and watch the full feature at any time of the day in just a few clicks. Ditto for damn near every image ever captured of a Vivid Girl. That can be attributed in part to a lack of clever marketing text – but I saw it more as a problem of not showing the user what they were getting into. Ya know, giving them examples, for fuck’s sake.

Even if you discount all of that – Vivid.com’s default page has stayed relatively unchanged for some 2 years now. That’s a long fuckin’ time for the same tour to be kickin’ around. They needed a new one. But, every outsourced design we got ahold of.. it just didn’t have that “feel” that Vivid.com needed. You can chalk that up to my being a relentless asshole, mostly. I knew I could do better, so I went on long tangents about every little thing I didn’t like about any design that crossed my path. This isn’t to say I was unfair – because none were altogether that good, and not a single one said “wow” to me. Vivid.com, I felt, should say “wow”. Err.. should make you, the surfer, say “wow!”.

My Proposal

You have to understand – I don’t follow porn trends. I rarely follow any trends, to be clear, but I’m more willing to work within a “popular” style that’s outside of what I’m doing, because I know there’s little competition there. While most of the porn industry consists of stealing one another’s work, and following like cattle the “next big thing”, I don’t pay much attention to all of that. I think about my work in a mainstream fashion, and I try to appeal to the mainstream. Why? Cause no one else will.

Starting out then, I knew whatever I was going to come up with was going to really fuck w/the people higher up than me. I knew they were going to initially point to figures and facts and say “no, no… we can’t do things this way” and I’d be fighting them tooth and nail if they even let me do it at all. I was prepared for that. And, I did get a lot of that, at first. I had the benefit, however, of being not only the only chance they had (being the sole designer and all) – but also because for having made almost every site they currently own, maintain and promote – I have inadvertantly been made solely responsilbe for what will be the “Vivid look” on the web.

Keeping that in mind, I had to tackle the issues I had with not only Vivid.com – but pornsites in general.

The first issue I decided to tackle was loading times, and filesizes. Vivid.com has so much shit to offer, so many girls on their roster, that trying to display all of it – or even to give a sampling of it, would kill the chances of anyone on less than the highest-speed connection seeing it to its full extent.

My solution? iframes.

Load the whole page up, keep the center dynamic, load everything into iframes. This way, you load the “interface” once, and you’re then just loading content into that interface. I knew how the porn industry felt about iframes. Not just my boss, though.. everyone seems to hate them in the industry. It’s hard to link to a specific page w/an iframe. Down-right impossible, unless you know the “trick”. Moreover, porn people love to make these gigantic pages that take up your whole screen and are impossible to ignore. If they had it their way – your browser would always be in “fullscreen” mode, and every click of the “back” button on your browser would pop a javascript prompt asking “are you sure you want to leave our lovely pornsite?”. Don’t think I’m doing schtick, I had a former boss ask about that before. Because I didn’t want to be responsible for such ridiculous manuevers, I used words he’d never understand to explain that such a thing would be technically impossible to pull off. He left it alone, thank fuck.

Beyond just using iframes – I decided I’d make the site “flashy”. Not just literally flashy (as in using Flash), but.. exciting. Fun. Whatever you wanna call it. I wanted people to look at this as a site, not a “porn site”, per se. Pigeon-holing gets you nowhere fast in any industry. Keeping with the theme of loading interfaces once, and content changing dynamically, a few of the more content-rich pages have iframes with linked lists that pop new Flash movies into a separate iframe. Those flash movies are only about 20-30k each, at most, and only load more content into them when requested by the surfer.

A common problem (at least, back in the day) with Flash is that no one really knew how to load a dynamic link into the Flash movie itself. Basically – when a webmaster sends us traffic, we need to grab a special code they send along with the link that says “hey, this is joebob – I’m sending you a surfer. If he joins – that’s my sale” and we pay him accordingly. Unfortunately, Flash doesn’t let you just say “hey, make this button a link that I can define in the HTML, outside of Flash”. Thankfully, my friend Jim clued me in that you can just link to a Javascript, and tell the javascript where to go from there. Since the javascript is embedded in the page, we can grab dynamic PHP variables into the page and insert them into the javascript, thereby making Flash link dynamically. Sweet.

Now, onto the problem of the “Vivid World” as we’re now calling it. The outside stuff – ShopVivid.com, VividPersonals, VividLive, etc. – where do you plug those things without just putting big, cheesy, ugly text links along the bottom, or bugging the surfer with seemingly endless pop-up windows (for those unfortunate enough to not have a pop-up blocker or realize that FireFox exists)?

My solution? little advertisements in image boxes.

I figured… give ‘em a little “light” above, so it’s like products featured on a shelf. If this is the virtual “front” for Vivid.com and kinda.. Vivid as a company – why not?

While we can swap those images in and out (even dynamically, within a link’s code), I also intend to make that whole area into a div with overflow : auto, so it can scroll left to right and show other random Vivid features/products – like the aforementioned E-cards, screensavers, cigars, condoms.. ad naseum really. It’s expandable to whatever we need. That’s the key with everything in the site – expandability. And, customization. We need to be able to use this tour for awhile, since if that last one stuck around for so long – lord only knows how long this one will. But it should never be stagnant and boring, and it should always be easily editable, without having to kick open Flash and Photoshop just make a quick change.

And, how do I make sure things can be updated more-or-less on-the-fly? External files.

Every image loaded into the “girls” page is done so externally, from images residing in a folder. Same w/the thumbnails for those images. Ditto all the text in the girls’ bios, and the videoclips on the Movies page (both the large and small ones), and.. well, all the text is pulled in through little text files. Change any of those, and it’s instantly changed on the tour. Even on the “Photos” page, we’re loading in text from within the members area, so you’re seeing the actual updates that took place that week. Granted, it’s just text cause we can’t actually show what’s in the members area – but you can see what’s going on inside, so you know we’re not just slacking.

Since Flash can be, at times, quite bulky, and loading in external files each with its own preloader is a hefty requirement for any Flash programmer – I went the slightly-cheesy route of just showing an indeterminate progress bar, and the images load over that animation. This way, as soon as it loads – it shows. Also, the big images have a transitional effect that at least gives you a little “show” while you’re waiting for the image to appear. On faster connections, it’s a lot more seemless, but on the slower connections – you’re not waiting too long (each full-size image is roughly 10k – which equals about 2.5 seconds on a 56k modem, that’s barely longer than the transitional animation I overlay while the image is loading).

The big issue was yet to come, however..

How do you show the surfer what’s in the members area, the sheer amount of content and goodies a site has – without actually showing them?

Give ‘em shitloads of previews and samples, push the envelope on what can be shown in a “guest” area, and take out just that which the lawyers will have issues with.

That brings us to the next point.

Content is king

That’s the number one thing I’ve heard more than anything else about making websites. Content is king. Unfortunately for us porn people – our content has to sit behind protected areas so kids can’t access it. But, we want to show you something, so we can at the very least entice you to join. We want you to think “if it’s this good out here – imagine what it’s like on the inside”. Not unlike what you’re probably thinking about the Vivid Girls themselves, no? ;)

My original solution, of which I utiilized when making all of the Vivid Girl sites I made, was to find 20-30 second videoclips that showed a Vivid Girl amidst a sexual act, but at a point where you couldn’t actually see anything. I’ve got one clip of Cassidey Rae getting fucked doggystyle while she’s lying face-down on a table. You see nothing of her tits, as their pressed against the table. You don’t see pink parts, because they’re off-screen. It’s a “perfect” clip. But, it’s only 30 seconds long, and.. it was a very small clip. In pixel size, I mean. It’s not enough for the tour.

To be honest, I would’ve left it at showing all the clips I made for the Vivid Girl tours – which is by itself at least 10 minutes of video, and showed that we had a fuckload of content. My manager, however, liked sites like Ten.com, where they pop a window and give you a full minute of 320×240 video.

Thing is – we couldn’t do that. We couldn’t show 1 minute of video without showing something we weren’t allowed to show. Ten.com gets around it because they have a video editing guy who puts a huge black bar across the bottom and fades in video that will leave the interesting shit in the video to reside behind the black bar. Moreover, they’re allowed to show nipples. We’re not. If you’re wondering why – realize Ten.com advertises in porn mags. Vivid advertises in Times Square. Little Johnny might not be reading porno mags – but anyone can see Times Square. If you’re gonna pull up a website that’s advertised 50 feet tall on the side of a building, that website shouldn’t expose you to anything “lewd”. So, we can’t show anything.

I suggested that we find a good 2-3 minutes of video on maybe 5 different DVDs, send the clips off to an outsourced company and have them use motion tracking to put modesty (which is what we call those “stars” that obscure nipples and what-not) on the areas of the videoclip that needed it.

Sounded like a fine solution, no? It was, except for one problem : no one would do it. We outsourced it and waited some 3-4 months. Nothing happened. No one came through.

Finally, I said “fuck it – get me Final Cut Pro and some DVDs and I’ll make the fuckin’ things” and I did just that.

For the combined period of over 70+ hours, I sat through 3 minutes of each of 12 videoclips that I personally pulled from the DVD library and made sure that wherever there was a female nipple – a Vivid “V” Star logo would appear over it, and a “Join Now!” badge over every cock and pussy. I didn’t find clips that would be “easy” to edit – I found clips that would look hot as fuck, regardless of nudity. That was probably the stupidest way to do it, but it was also the best – those clips will fuckin’ get you hard, goddamnit.

Do the math. The clips were running at 15 FPS (frames per second), averaging around 3 minutes each. That’s 2700 frames. 2700 frames of hardcore sex scenes. Meaning at least 3/4 of that time – something we weren’t supposed to show was showing. I tracked the Vivid Star logo and the “Join Now” badge on every single frame of video for a combined 36+ minutes of video. It was by no means easy, nor was it quick and painless. But it was a labor of love – because this tour now gives you, the surfer, over 45 minutes of video for the taking. Find me another tour that does that, legally, and has as much content as Vivid.com and I’ll find you Santa Claus.

I could also point out that I did all of that editing while in my personal life I was dealing w/my recent crisis of having my ex (who looked a bit like a few of the Vivid Girls) hide her life from me, and run off to marry her now-husband, leaving me heartbroken, single, and needless to say – completely unsexed. I’m not here to dwell on my losses, but to celebrate my victories – but I just had to point that out cause it was a pretty sore thing to have on one’s mind while applying frame-by-frame modesty to hardcore XXX videoclips for 8 hours a day.

As for the images on the “girls” page.. that was pretty easy, admittedly. Pick 4 hot images of each of the 30+ girls featured in the tour, and make sure to never leave any female nipples or pink parts uncovered. It still took many hours – but it wasn’t shit next to all that video editing.

But wait.. there’s more..

Customization and Deep Linking

Deep Linking is what we call it when you can send your special “code” through to a specific page or part of a given tour. A tour, by the way, is what we call that “guest area” you see – when you hit “free tour” on a porn site.. you’re “on the tour”. Now you know.

I mentioned earlier – porno people (from here on out, I’ll call them what we call them in the biz – “webmasters”) hate iframes. Why? Because you can’t “deep link” to them. If you have content loading into an iframe, and you do what most people do and just grab all that stuff written in the URL bar of your browser – you’re not sending a link to the iframe content, you’re sending a link to its container. In other words – they’re seeing the full page that was pulled up, and most likely whatever was loaded into that iframe … ain’t gonna be there, the surfer will have to click around to find it.

That’s a problem.

Webmasters like the ability to send people to the 2nd or 3rd page. Past the “warning” page, as it were. This is especially true for webmasters who are sending traffic from sites beyond their own warning page. They also like the ability, in the case of Vivid, to send people to a tour that’s centered around a Vivid Girl that is most popular w/their traffic.

So, how did I solve both problems at once?

PHP and variables.

For each iframe, there’s certain extra code I can tack on to each link that says “when this page loads – show Vivid Girl X first..”. Also, the header image is random by default – but if I give someone the code to make the tour centered around, say.. Jenna – then Jenna will be in the header image.

Some examples.. (don’t worry, you won’t get pop-ups through these links, and they’ll open in a new window so you can close them when you’re done and you’ll be right back here again)

Feature Jenna – This will go straight to the “girls” page, show Jenna Jameson first, put her image in the header, and play her movie first when hitting the “movies” page.

Feature Briana – This will go straight to the “movies” page, and play a clip of Briana Banks getting fucked. Also, swap out the header to feature Briana Banks, and if they click to the “girls” page, show her profile first.

You get the idea. If a girl is set – then any page that has content for that girl, it will show said content first before the user clicks past. Also, making the header image feature that girl will make the surfer feel like their fave Vivid Girl is also a “big star” in the Vivid World. And, of course, we can skip over that warning page with just one simple link.

Beyond just customizing for which page/girl to show – we also wanted webmasters to choose which (if any) of the extra Vivid World products they wanted to promote. Those 4 boxes at the bottom? They can be customized. Even if a webmaster decides they want to promote, for instance, ShopVivid.com and Vivid Live – they can opt to replace one of the other boxes with one that just points out a feature in the Vivid tour, instead. An Example follows :

Feature + Ads – The first box builds on the feature of “movies” and clicking the first box will take the tour to the movies page (again, no refresh cause.. we’re using iframes). The 2nd box advertises VividLive.com, and the 3rd and 4th plug products we sell through ShopVivid.com.

All of those links can generate more money for a webmaster, so it does them well to plug outside of Vivid.com. Since the links to outside sites open in new, blank windows – the surfer never leaves Vivid.com, and so will return to Vivid.com when they’re done shopping, or chatting or.. whatever it is they’re doing.

Remember now – ideally, the surfer should never leave. Giving them 120+ images and over 45 minutes of video means we’ve got a pretty high likelihood of keeping them around for awhile.

Last minute details

Near the end of the design of the tour, my boss expressed her distaste with the “warning” page (also called “the splash screen” in web design terms). It originally had a picture of Vivid Girl Tawny Roberts, plus the 3 buttons (enter, join now, members) and the warning text. She wanted.. video. Talk about bucking trends. Who puts a video on a splash screen?? But, try as I might to fight it – I couldn’t and Steven Hirsch himself (president of Vivid) was ecstatic about it. Vivid’s own video editor made a special clip for the warning page, even.

I had the unique challenge of figuring out how to present the video and not fuck up the “wow” and the spiff of the site. So.. I put the fuckin’ thing inside of a TV. I grabbed an image of a 2005 Platinum-Series widescreen Mitsubishi TV. It had a large bottom half for speakers – which is what I need because I needed to fill all kinds of space on the left-hand side.

They didn’t like it. Most said “that TV looks too old”. Okay. Damn. Some even suggested putting it inside of a fake Windows Media Player interface. I fuckin’ hate it when websites do that. You see an interface that looks familiar, you want it to work that way. When it doesn’t – you get pissed. So, no.. fuck that. I said “I’m going with a TV”.

I found a nice Samsung DLP widescreen TV that sat atop a nice chrome column on a triangular base. Perfect. Problem is, I wanted that angled 3/4 view and no one had a high-res photo of the TV at a 3/4 view. Best I could find was barely 200 pixels tall. That’s about half of what I needed it to be.

So, I just traced the shitty quality image in Photoshop using the pen tool, and put each piece on its own layer. Then, I used some layer styles that I had, to make it look kinda “chrome”, added a Vivid Star where the power button of the TV would’ve gone, and then added some gloss and sheen highlights around the edges to give the screen a “glass” look.

We also fought about the video, its quality, its length, bla bla bla. You don’t wanna hear about that. When all was said and done, I knew I didn’t want dial-up fuckers to deal with a 1MB videoclip on the load of the page, so I helped them out.

When you load up the page, you see (for hopefully only a split second) a TV that says “PLEASE WAIT WHILE WE OPTIMIZE VIVID.COM FOR YOUR SYSTEM”. What you don’t see is the invisible Flash movie just off the edge of the screen. It’s trying to load a 15k jpeg. As soon as that Flash movie finishes loading, it kicks you off to the 1MB video (it’s actually only 650k now that I’ve optimized it a bit more). Now, what if you’re on dial-up? You can’t load 15k very quickly. A high speed connection can do 15k in mere fractions of a second. So, I tell the page itself to refresh and go to the low-quality (about 150k) video, after 1 second. If you can load the 15k jpeg in under a second – you get the high-quality video, if not, you get redirected to the low-quality video.

Now you can make your own speed test, aren’t you happy?

Wrapping it up

So, that’s a feature tour of the feature tour. A behind the scenes look at my day-to-day work. An enormous self-love fest, to be sure. But, c’mon.. surely some of that might have been interesting to you, no?

I’d like to give some thanks, as if this were an acceptance speech.

To Leslie Sharp, my manager, for accepting my ridiculous idea for a tour as a good idea – and speaking out on my behalf against those higher up than both of us who didn’t like what she and/or I liked. Obviously, this tour wouldn’t have gone up without you, and I appreciate immensely that you respected my vision and let me see it through. Even if I do make a lot of off-color remarks ;)

To Donnie White, our lead programmer, for helping me out of a bind when I was pulling my little designer mohawk hair out trying to code this bitch, for coding some of the advanced webmaster features of the tour, for helping me troubleshoot all the shit that was going wrong with it in the beginning, for consistently thinking outside the box, and.. for putting up with all my constant gay jokes. You know I kid. Good luck with your wedding and don’t let her catch you choking on cock, buddy! (sorry.. I couldn’t resist).

To Eric Cha, our troubleshooting expert, who took the time to actually go through everything in the tour with a fine-toothed comb so we could launch this fucker with pride and without worry. You da man, sir.

To James Caldito, our website update/maintence/troubleshooting lead, for making that initial test video for the splash screen. It was an awkward size, to be sure, but you didn’t seem to mind so I thank you for not slapping me upside the head when I requested it.

To Jim Kunz, formerly our other Web Designer, for teaching me the dynamic javascript-flash link trick, and for finding that one frame of video that showed a partial nipple in one of the clips. I think I nailed it this time, though. I know you’re gonna say I’m a total fag (pronounced FEE-AGH) for posting all of this so.. you can suck my left one, sir ;)

…and of course, the rest of the team. I’m not discounting your work by not mentioning you here – you’re all damn good and if this weren’t the best fuckin’ team I’ve ever worked with, I’d have left or killed us all by now :)

Anyway. It was a goal in my life to design a site that gets up to 1 million hits a week – and I’ve done that. Being near-solely responsible for the default homepage of the highest-selling porn company in the world is a nice feeling. I’m gonna go celebrate now, and get thoroughly shit-faced.

Thank you for reading. Now go get yourself some porn.

Related posts:

1. Vivid Does Another “industry first”
2. Mitcz on your Trash TV in 3 days.
3. Regression Bugs in Safari 1.3

I apologize, Dave, ahead of time that this is a pretty non-technical post. While I’m able to hand-code my own CSS/XHTML without reference tables or constant checks on the W3C site (or much anywhere else), I haven’t had the time to go through and figure out exactly why each of the bugs are occurring, nor have I bothered to find a temporary fix just yet. I just discovered these today, in fact.

On RevMitcz.com (my design and coding work), in the Design section – the tabs are being displayed top-to-bottom. An example is shown below. The first one is rendered via FireFox 1.03, the second one is Safari 1.3.

On VividCash.com (also designed/coded by me), on the front page, the “login now” button overlaps the username login field. Examples again – FF 1.03 on top, Safari 1.3 on bottom :

Those are the only two I’ve found thus far. I’m very pleased that Safari finally allows the usage of a mouse scroll wheel in overflow:auto (and overflow:scroll) boxes. One step closer to the death of the iFrame. Also, I’m very pleased with the speed of rendering sites, and their faster display times.

I’ve also discovered that Safari 1.3 will properly put DHTML/XHTML/CSS dropdown menus over overflow:auto/scroll content, whereas it would not before (Safari 1.2 and earlier). Unfortunately, it still doesn’t overlap an iFrame, but we’re getting closer. To see this bug in action using any version of Safari, load up this page and try to select any of the items under “Personal”, which are dropping into the iFrame below. On other browsers, it’ll work fine – but not in Safari. The solution I’ve used in the interim is to allow top-level menu clicks to hide the bottom div’s content, so the menus can be used for navigation while the content is hidden. Try it out and see. If you’re using Safari 1.2 or earlier, you’ll have that dropdown issue on any of the pages where a menu drops over an overflow:auto/scroll div.

Related posts:

1. Design Issues Part 1 : Browsers and Related Design Ethics
2. Vivid.com : Goal, Completed.
3. Mitcz.com Redesign, and a new logo

Want some examples? Some ways to deal with it? Maybe you just like to watch designers vent… then read on.

Warning : Geek Ahead

As I’ve mentioned before, I’ve been designing – specifically designing websites – for almost 10 years now. I’ve used every version of Photoshop ever officially released (and even a few betas) from 1.0 up to the most recent CS (v8.0). I’ve used GoLive since it became GoLive (upgrading from “Adobe PageMill”). Dreamweaver, I remember when that was released. Flash – I’ve used it since 2.0 and can actually remember where I was when 3.0 was released to the public.

I’m such a design geek, in fact, that I’ve actually used Photoshop’s versions as a guide to milestones in my career and as a timekeeper. “Hey man, remember the summer of ‘97?” you might say, to which I might actually reply “Yeah… man, Photoshop 4.0 was released a few months prior and introduced the amazing all-in-one Free Transform tool, finally bundled for free the PS Gallery Effects Filters, and introduced a live-updating text input window!”. Yes, I’m a total fucking geek for this shit.

My friend and I were talking the other day and he said that his culinary-school-graduate girlfriend has this intimate obsession with food. She’ll take herself out every few months to some really fancy restaurant and sit there all alone dining on their finest dishes, almost orgasmically. He had just received a nice bonus check from work, he said “I’ve been with her for some 7 months now.. and I’ve never been able to take her out to places like that, but tonight.. I am”. I didn’t quite get it, to be honest. He says “don’t you have anything that just.. ‘does it’ for you? Ya know.. something that, if you have the money, you’ll spend it on and just be happy as shit?”. My geek response? “Yeah. New hardware and software for my computer”.

I don’t “get” food. I don’t much care for it. Hell, I’m still trying to find a way to mix all the nutrients I might need throughout a given day into one quick “sauce” that I could just drink and get on with my day, without ever feeling hungry. Food is a nuisance, so far as I’m concerned. I mean – a good meal beats a shitty meal any day of the week, but there’s many things I’d rather spend my time and money on than that.

All things said – I’m a fuckin’ geek for this shit. I’ll admit it, without issue. I spend my free time reading design magazines, design websites, reading up on the latest software/hardware technologies, trying out the “free trial” on new software, and just generally keeping up on what’s new and exciting in the world of web technologies and design trends. This isn’t an entirely futile experience, however, as I’m one of the most qualified web designers you’re likely to find out there. Friends in and out of web, design, and computer fields come to me all the time for buying advice, reviews, tech support, et al. I am, to some, an “expert” in my field.

You would think, with all this shit under my belt, when a client wants me to design something for them – my opinion is the one that matters most. My professional opinion, certainly, should be of a certain paramount to them. Ditto for management that I’ve worked under. Shouldn’t my “expertise” count for something when it’s (sadly) one of my few great passions in life? In a perfect world, yes. In this world? Not so much.

A Lesson In Futility

I have a little story to tell. For those of you who require visual stimulation, I will provide pictures for the story. This is one that I’ve told people for the last 8 years now, because this story actually happened. Designers won’t be the least bit surprised, but those not in design will likely have to pick their jaws up off the floor, or get ice for their forehead that they’ll be smacking by the time it reaches its conclusion.

I would normally change the names of people and companies I’m talking about when telling stories, but I’m not going to do that this time. I have no desire to and I’d love to see them come after me for it. I’m still holding a grudge, because this little “incident” is what kept me from working in a design department for my entire professional life, until a few years ago when I fell into the porn industry.

The summer of ‘97 (yeah, yeah, the Photoshop 4.0 summer), I had just graduated high school and my friend Trevor and I were living it up, jobless, and taking regular trips from Phoenix, AZ to Sedona, AZ almost every weekend. My mom kept disappearing that summer to go off kayaking w/her new husband, so she’d leave behind “take care of yourself” money for me. It was always more than enough for me to live on, so I got a lot of playtime. Before you think I’m a spoiled bitch, you should know this was a first-time, last-time opportunity in my life. Near the end of the summer, my mom came to me to say she’d accepted a job in Colorado for teaching and would be moving in the next 2 months. My stepdad would be moved out by December, so I best get a job, a car, and an apartment. There went my summer.

I landed a job at a local newspaper. The name? “The Independent”. They were a shitty, free paper that you could get in those little metal boxes outside of Denny’s or whatever. They had one for each metropolitan-type area of Phoenix – Paradise Valley being the one I lived in at the time, and the one I would be working for. I started the job under the guise that I would be “designing” for them. Nope. Sorry. All I did was physically put onto layout sheets the logos and text for the companies that advertised w/them, and all the actual design work was already finished way before I got around to it. The rest of my time, I spent in the classified ads dept. working with customers to place “free” ads for the paper.

They had this little deal going on, hell.. they probably still do, where you could place an ad that was less than.. 20 words, I think, for “common household items, under $1,000″. Pretty sweet deal, if you just happened to wanna toss something common from your household and didn’t stand to rake in serious cash with it. The ad would run for 2 weeks, then it was your duty to call and renew it.

One lonely day my manager, Linda, came to me and said “I’d like to create an ad that advertises our ‘free classifieds’ in an eye-catching way. This is your chance to impress me”. I was pretty excited, really, cause… this was my first actual design job. I’ve never designed anything for anyone before – it was always either for myself, my band, or for an assignment in my design class in high school. I got to work right away, and while sitting there contemplating how to do it and what to say – I saw a nickel sitting on my desk that I’d play with when I was bored. I thought “that’s it!” and popped open my scanner, scanned the nickel, and got to work.

Here’s a crude version of what I came up with…

Pretty basic, no? I thought “hey, a picture’s worth 1000 words – I just need it to say a few here”. The support text below the headline basically filled in the details of the offer. That was more than enough space to write out “That’s right! When you place an ad for your common household item that you’re selling for under $1,000, we’ll give you 20 words in our paper, along with your contact information, for 2 weeks for free! When the ad runs out, just give us a call to place it again and it’ll run for another 2 weeks or until you tell us to cancel it. When you’re ready, just give us a call.”

So, here’s convo #1 with Linda (aka worthless whore):

Whore : Uhh… well, I like where you’re going with it, but… it needs to say more. It should at least say “THIS is more than…” so people know what you’re referring to.

Me : Isn’t a picture supposed to be worth 1000 words? I can’t get TWO outta that?

Whore : Well, I just think it reads better. It’s a complete sentence that way. It’s just proper english. We like to promote that. Also, it should say “in the Independent” instead of “our paper”. That sounds too generic.

Me : So, they’re not going to know what paper they’re reading, despite our name being on every page PLUS the bottom?

Whore : That’s how we do things, Mitcz. Go change it, please.

Fuck you, Linda.

I cursed under my breath, and then appeased the bitch. A little note for non-designers, companies love their fuckin’ name. They love it. They want it everywhere they can get it. Seriously, it’s a running theme “make sure our logo is on it – mention our name more”. “But.. sir, the ad just says ‘ShittyCo wishes you happy holidays, what else can I put there?”. “Well, I just want to make sure our logo is on the top and the bottom, so they realize it’s THE ShittyCo, and not just a ripoff using the same name”. Yes, that’s the logic of management people.

Now, the appeasement ad..

The conversations I’m writing out here are as close to the actual conversations as I can remember them. My sneering, defensive attitude isn’t exaggerated. I have little patience for ridiculous comments, and when they’re keeping me from getting my work done – they’re even less appreciated. So, I tend to get snippy and question everything. Isn’t that what my generation is supposed to do? Question Authority? Mmkay. Thought so.

Bitchface : Okay… it says ‘more than the cost of an ad’ but it’s not just “an ad” – it’s a classified ad. And, for free items. Cars aren’t included, for instance, you know that.

Me : Yes, I understand that, and that’s why there’s this paragraph of text explaining everything, right here.

Bitchface : I see nothing about not being able to sell cars in that paragraph.

Me : My bad, this is a mockup, so I can gladly add that line right now so we can send this off to print.

Bitchface : No, no… see, people don’t read anything. They’re not going to read that fine print. They’re going to think EVERY ad in our paper is free, no matter what. Our phones will be ringing off the hook.

Me : So, you’re actually telling me that people, READING a paper, aren’t actually reading it and they’ll come across this ad and assume the fine print is just filler, and toss aside the natural American paranoia about everything and just call up a random number to place an ad without reading a single line on the ad?

Bitchface : Yes, Mitcz. That’s what these people do. Also, we can bring the phone number’s size down a bit, else people might be calling the number before they know why they’re calling it, and bring up the size of the logo (editor’s note : remember what I said about companies and their names/logos?).

Me : Okay – so what about all this fine-print stuff?

Bitchface : Just make it bigger.

Me : Then people will suddenly decide it’s time to read?

Bitchface : I’m very busy, come to me with the changes.

Managers are also “very busy” a lot of the time. They don’t have time to tell you how to do your job. And they’ll say just that – “I don’t have time for this, you should know how to do your job”. I do know how to do my job. How about we switch places and we’ll see what the fuck you can do in an hour of sitting in front of my computer, and I’ll tell you a new reason every 10 seconds why it’s worthless shit to me?

The next appeasement..

Cuntrag : No, no, no… you didn’t change the headline. I just told you, people aren’t going to read fine print!

Me : You told me to make it bigger. It was 12 point Helvetica, now it’s 16 point Helvetica. That’s pretty big, and not really “fine” print anymore.

Cuntrag : The headline should say “This is more than what it costs to run a classified ad in the independent for household items under $1,000″ then give it a phone number, a little smaller, shrink the nickel down, and bring up the logo size a bit more.

Me : If I do that, you’re gonna have a 4-line headline. That’s ridiculous. What’s the fine print going to say?

Cuntrag : The fine print should be large, and should say “Cars may not be placed for sale in the Independent for free, regardless of price. However, we’ll gladly place your vehicle’s classified ad for a small fee. Call us for details.”

Me : I cannot believe you’re serious about this. That’s going to destroy my ad. It’s… that’s… I’ll do it just to show you how bad that looks

Cuntag : You do that, and we’ll take it to the head of the design department and she’ll tell you otherwise.

Me : And if you’re wrong, can I show her my original and get her opinion?

Cuntrag : Mitcz, you’re young and you’re fresh out of high school. I think you’ve got talent, but you’re not a designer. I didn’t hire you as a designer. Go make the changes I requested and then sit with (designer lady’s name, which escapes me) and she’ll tell you why it’s the preferred ad.

I was pretty fuckin’ upset by this point. I’d actually been working at this place for about 6 months now. I had another job, telemarketing no less, lined up that I was ready to take. Knowing I could never put up with Linda’s overwhelming stupidity, I decided I would appease her and keep the copies of the ad that I made so I could tell this story to people later in life. I still have those copies somewhere, but… they’re in a box somewhere. Oh well. In that box I’ve also got all the printed papers that show the company logos I “modified” to look like Jesus being fucked in the ass, guys w/their cocks hanging out, and a few hidden curse words behind certain areas that probably only I was able to see. I wouldn’t probably do that now-a-days, but then.. you shouldn’t be a fuckhead to your designer anymore than you should yell at the guy in the drive-thru. He can spit in your food, I can photoshop a penis onto your logo that you won’t see until it goes to print.

Now, this is the pile of shit that my ad became..

The fucking bitchmouth looked over it, said “hmm…” and then “c’mon..” to usher me towards the head of the design department. This is a lady I’ve never met before, oddly enough, but I was excited to see Linda be so very fucking wrong. I may not know much – but I know that ad is a pile of shit. I had secretly placed a copy of my original ad in my pocket, to show this designer lady. I’m gonna call the designer lady “Sally” cause I can’t remember her name.

Bitchmouth : Sally, could you come take a look at this ad, and tell me if we could run this

Sally : Sure.. what ya got there?

Bitchmouth : This is an ad that Mitcz did

Me : It’s actually nothing like what I made…

(now cutting me off)

Bitchmouth : Just let me know your full opinion

Sally : I don’t wanna be rude, but.. Mitcz – where did you go to school?

Me : You mean for design? I took a class in high school

Sally : And they told you to use 18 point Helvetica for support text and 4-line headlines?

Me : No… I…

(cutting me off again)

Bitchmouth : Can we run this ad?

Sally : Are you kidding me? With a 4-line headline? Why didn’t you just write all of that in the support text? Smaller, support text, no less. And, You could make the headline much cleaner and shorter. Focus on the nickel, that’s what grabs their attention.

Bitchmouth : You see, Mitcz? We can’t run this ad.

I was so pissed, I couldn’t even respond. She just blamed her design decisions on me. I couldn’t take it. I actually quit right then and there. I said “Linda – you can go to hell, and I’m going home” I grabbed the ad, ripped it up and said “THIS! Is NOT my ad, Linda and you fucking know it!” and I pulled out the “good one” and showed it to Sally. She said “This is much better”. I grabbed it out of her hand and said “Good – then you can design it for Linda and we can all pretend this whole thing never happened”.

I haven’t been back in a mainstream design department since. Not because of a bad reference, but because that left me with such a bad taste in my mouth, I decided I didn’t want to have to put up with a management person ever again.

Problem is – clients aren’t a great deal better. And, while your manager might let some shit slide on one project because they can pass it to the next designer, or make you stay late for fear of losing your job – a client will just cease communication and payment for your work and have the whole project swept out from under your feet. It’s happened to me before, and it ain’t pretty.

That story, however, was very real. It has become, however, a metaphor for how designers and “creative directors” (as they’re sometimes called) tend to disagree. When the person who approves your designs doesn’t like what you’ve done, they’ll tell you to change it. Not being a designer, they have no idea how they want it changed. They just know they don’t like what they see. This leads you on a sort of design wild goose chase, until you appease them. When someone who they’ll admit knows more than them tells them the err of their ways – they will blame it all on the designer.

It is my firm belief that all great things in this world were rejected by idiotic management people several times before someone finally sought out the right person (or did it on their own dime) to see it through to the final stages. I believe there’s probably 100’s of 1000’s of amazing products out there that we may never see because some stuffed-shirt asshole is telling someone they consider to be a “lackey” that their brilliant idea “will never work”. I don’t mean just in design, by the way.

Did you know that Intel used to make the processors that ran stoplights – but when an employee said “we should make a computer for the home!” was told “why would anyone want one of those?”. The employee, relentlessly dedicated to the idea, came up with several reasons, amongst those: an advanced calculator, a place for the wife to keep her recipes, and a place for lawyers to keep their important documents for archival. It wasn’t for another 15 years that IBM came to them and said “make processors for our home computers – we’ve got to beat these Apple people”.

Also computer-related (I told you, I’m a geek), Xerox (yeah, the paper and copier people) had a research lab called “XEROX PARC” (Palo Alto Research Center) where they had invented a working computer with a GUI (Graphical User Interface – meaning a visible, non-text-based interface… basically, what most of us use today), a “mouse” (though they called it something else at the time), computer response to voice commands, the folder/window/file metaphor, Ethernet, and local networking. In 1981, Xerox came to PARC and said “what the hell is all this shit?” and were given a very thorough presentation. The management people said “yeah, that’s great and all but.. who needs a computer in the home? And, who’s gonna figure out all this file/folder/window stuff? This is ridiculous!”. They immediately told PARC to shut down their research and move on. Just before they did that, they invited a man named Steve Jobs into the labs to check out the work. They said “yeah, we’re just gonna throw all this stuff away – you want it?” He said “yeah!!!” and in 1984, Apple Computer headed by Steve Jobs, introduced the first home computer complete with a GUI, and called it a Macintosh. Microsoft followed suit some years later, after having been invited to PARC just weeks after Jobs, and they developed an OS for IBM’s home computer and called it “Windows”.

One day, I’ll write a book about all the times management people have prevented the furthering of our technology, of progress, and.. perhaps of mankind. If God had a boss, we’d all be platypuses.

How To Handle “Experts” Who Don’t Know Shit

While I’ve given you a pretty solid example of just how much of a pain in the ass it is to be a designer, and I’ve got more examples than I could shake a stick at, it’s important to realize that there are alternatives. Alternatives that, if executed well enough, could get that design you’d hate to let go see its way to final print (or final upload, for the web designers out there).

First off, you have to throw out a vast portion of your ego. As a designer, you should never become too attached to any one design. If you’re going for a look that your company hasn’t seen anything like before – try to be quick about doing a mockup first. This way, you’ve not invested too much time in it when they say “what the hell is this? get back to the drawing board, kid!”.

You should know that most of the time, the first thing you come up with for any client or boss – they’re going to hate it. Or, if you’re lucky, they just won’t mind it that bad. Even if they tell you they love it, change it anyway cause they’re secretly disliking it or they’ll wait until it’s further along to tell you so. This might be how they exercise control – it’s an age-old business tactic “reject their initial offer”, so they’ll reject you the first time, almost every time. Be prepared for that. Personally, I always mock up something very rough that I’m not altogether happy with and I show that to them, just to get a feel for what they want. Then, if they love it, I just “up the ante” and make it look a fuckload better. If they totally hate it, I change all the colors and then I did a little different layout. Most of the time, they won’t notice and they’ll consider it an improvement and now you’re making progress.

Once you’ve got a design that they’ve semi-approved, timeliness is of the essence. The longer they have to wait for a final product, the more they’re going to hate how it looks. Why? Because it becomes old, it’s not new and exciting anymore. So, you want to make sure you work fast. That’s important – but be thorough when you’re taking something from mockup to final, you don’t want them to be able to point out all of your mistakes. After a few mistakes, depending on how “expert” they consider you to be, they’ll just ask you to start all over again. No good.

Okay, so now you’ve got your design for “Spiffy Nights Vacation Resort” almost finalized. You present it to the client, and they want their logo bigger. Fuck. You can’t do that, the whole design is perfectly balanced as it is, and that’s a change that would throw the whole thing off. But, you have to know they don’t understand “delicate balance” because they’re business people and business people always laughed at the drama kids and the “weird” art students and all your fancy designs don’t mean shit to them and they’ll never quite understand why making their logo take up 1/2 the page of an ad with a picture of a beach on the other half doesn’t leave room for any support text that they simply MUST have in there.

Where do you go from there? You have two options – appease the client, or confuse the client.

You already know what to do for appeasing the client, you bend over and do as they say. That’s pretty easy. But what about this other option – confusing the client? Let’s take this example..

You want to say:

Look here, bubba, you don’t know shit about design and you can’t quite fathom that this whole ad is based on the delicate balance of whitespace, and cranking up the size of your logo would force me to kill myself over the sheer ugliness of it or I’d have to start over from scratch and I don’t want to spend another minute dealing with you and your shitty decisions as a non-designer!

Instead, we’ll confuse the client and bend them to our ways, with something like…

Okay.. if I crank your logo up too much, you’re going to impede on all the other things in this ad. Your logo, at this size, in this space, creates a perfect symbiotic relationship with the surrounding whitespace – even though it’s not white, we call it whitespace – and it actually causes your logo to stand out MORE at this size because of the path of your eye throughout the ad. You don’t want to focus on your logo too much, because it will confuse the viewer and they’ll move along. You want them to say “Wow – vacation in Maui? Who’s doing this?” and THEN see your logo. This way, you’re focusing on the product and they feel trust from the offer, without being bogged down w/the specifics. This creates an easing, and makes the consumer feel like they’ve got the power and a consumer who feels like they’re in charge is a consumer with spending power that’s not afraid to use it. However, I could make the logo a bit bigger, but it’s going to cause me to start over from scratch to capture that “perfect feel” for the consumer all over again – and it looks like we’re running out of time. But, it is your choice

That might be a tad exaggerated. However, the point is there. We’ve confused the client with fancy terms, let them in on what sound like design secrets, proved our “expertise”, and then topped it off with offering them the final choice on the matter – but making it sound very unappealing to cause you to do all that work. Most of the time, long speeches like that will work. If they don’t – you can either tell them to fuck off, appease their needs, or start over from scratch cause maybe that design was for shit in the first place and that’s why they can’t decide what needs to change.

Supposing that does work, what happens next? Well, you’re either ready for print (or to “go live” with the upload, in web design terminology) or they’re going to bring on the opinion of someone they consider to be an expert. Usually, this is another designer. This is where life starts to suck

The “Other” Expert

Designers are some critical, catty bitches. I don’t know why but it seems that, unless you’re working with them, any designer other than you is a worthless fool. If you don’t believe me, find a designer at random and show him a random design and ask for his opinion. He or she will wax emphatically about every nuance of the piece. Rarely, if ever, will they say something nice, unless they’re just trying not to sound like a negative bitch. Something like “…… but it’s not a BAD design, I’m just not a fan of that typeface, personally” is very common to hear at the end of a designer’s rant.

If a client/boss seeks the aide of another design to mull over your design – that designer is going to hate it, unless you two are on good terms. This is the case about 98% of the time. In fact, even non-designers who have no expertise and no say on the matter whatsoever will rarely give you a good opinion on your design when asked by your client/boss. Everyone’s an expert… except you.

Just last week, I was making an ad and the client showed it to about 5 different people and CC’d me on their responses. Every one of them had SOMETHING to say about it. Most of them liked it “but…. I would say, change this…”. Each of them suggested a different change for a different thing. Most of these things conflicted. After all, when one pseudo-expert says “keep it black” and another says “this would be better if it were blue” then what can you do? Personally, I just copped an attitude and said “who are these people, why does their opinion supersede mine, and which one of them do I listen to when there’s a conflict of design interest?”. I got no response, I finished the ad on my own terms, and the client was perfectly happy. I just assume they think I took the advice of the people asked – since the client didn’t bother to read their actual responses.

When you don’t have the luxury of ignoring the “expert” designer (or whomever they ask), then you can either try confusing them, or pretend they’ve confused you and do something that will appease them enough but still keep you happy. What I mean by this is that if, for instance, another designer says “they really should make this image more ‘dramatic’ and maximize the whitespace in this area” (which, I swear to you, I’ve actually heard from another designer who was sought out for his opinion) you’re fucked out of the option of trying to confuse them. They’ve trumped you on bullshit terms. No two designers that know and respect one another will ever say “I like how you’re maximized the drama on this photo and your delicate balance of whitespace is nothing less than amazing”. They’ll say “that’s pretty badass – reminds me of that Silence of the Lambs movie poster… cool shit, man”.

So, taking that bullshit line – you fake confusion and move some things around, brighten the image and give it a border. Then you present it to the client with “they suggested maximizing whitespace and dramatizing the image – I hadn’t considered going that far with it, but I agree and I think it looks much better now”. If all goes well – you’re more respected for following that direction, not being a dickhead about being

“wrong” but you’ve also not admitted fault and therefore you’re one step closer to being the “expert”.

It’s this delicate balance of confusing the client and their colleagues enough to get your design finished, pretending to be confused so you don’t have to keep starting over from scratch, and trying to actually make the best design you can from the get-go that comprises just about every design you’ll ever make in your life.

It’s sad, but it’s true.

And, that concludes our design lesson this time.

Feel free to comment. I know there’s likely to be at least one pretentious designer out there that’s biting his knuckles because I’ve been a bit too blunt about the bullshit we sometimes have to spew out, and will claim all design is “pure art, from the gods themselves” and will finish with “but you suck as a designer anyway”. That’s cool, blow me.

Related posts:

1. Design Issues Part 1 : Browsers and Related Design Ethics
2. Mitcz.com Redesign, and a new logo
3. BellaVendetta.com Launches

As of this writing, their are about 5 major browsers (not including their version numbers). These include Microsoft’s Internet Explorer, Mozilla’s FireFox, Netscape, Opera and for the Mac-only crowd, Apple’s Safari. Beyond that, their are several browsers based on Mozilla’s code, some based on the “KHTML” rendering engine (as used in Safari, for instance) , text-based browsers, and about million other rarely-ever-used browsers. This still doesn’t include the differences amongst various Operating Systems, and the differences between the various versions of each of the aforementioned browsers. What’s a Web Designer to do?

Up until quite recently (and I mean in the last 2-3 years, at best), the general rule was “design for IE, hope it works everywhere else”. A quick look at W3Schools’ Browser Stats Page shows IE as the kingpin of browsers, even to this day. Taking into account both IE 5 and IE 6, Microsoft powered the browser used by an average of 88% of users on the web for quite some time. Further stats can show that if all flavors of Windows were taken into account, damn-near 90% of those browsing the web were doing so using a Windows-based machine running Internet Explorer. Mind you, stats don’t tell the whole story, but when you’re pumping millions of dollars into a website, you have to figure out pretty quick how the world at large is going to view your megaultraniftysite.com homepage. The easiest way to do that, of course, is to check browser statistics. The story of the stats was pretty much the same for many years, WinIE was king and the rest were just a minority of the web that few people ever worried about.

Recently, however, there’s been a major shift in browser usage and while IE is still king – it’s not the only browser one needs to worry about and doing so would leave some 25-30% of the web out of the loop. Some might argue that to worry about every version of every flavor of every browser is not only tedious and difficult, it’s time wasted. I couldn’t disagree more, of course, and I’m not the only one. There’s been a major shift in web design, in how we as a collective design community build and maintain our sites, and this shift was more-or-less spearheaded by an organization called the World Wide Web Consortium (or W3C, for short).

Over 10 years ago, the W3C began drafting specifications for interoperability between browsers and trying to ensure that if something looked a certain way in one browser – it should follow that look/functionality in another browser. It’s a lofty goal, and one that Microsoft seems to just want to shit all over by continually ignoring W3C specs in their releases of IE. We’re much closer to standards-compliance in the latest release of IE6 SP2 than ever before, and with CSS/XHTML becoming more popular than ever before, designing with standards in mind should yield almost identical results in almost all browsers released in the last 4-5 years.

Honestly, I don’t worry about every single browser in the world. I design for about 8-10 different browsers/versions, and I have rules about each one of them. Those rules are as follows:

Microsoft’s Internet Explorer

Basics : It’s the browser we all love to hate. Different not only from version to version, but from OS to OS (the Mac version of IE 5, for instance, has an entirely different set of bugs than it’s Windows counterpart, making it the only current browser that functions differently across OS’s) – this browser is a constant thorn in the side of any designer looking to stay standards-compliant. Personally, I run Virtual PC with Windows 2k and use/design for IE 6. While I can’t test anything that requires speed (*ahem* like Flash), it will show with perfect accuracy what the average IE user will see – and for that, it’s worth a lot to me. On the Mac side of things, I use/design for IE 5.2

Version(s) : 6.0 for Windows, and 5.2 for OS X.

Special Exceptions : I’ll let you in on a dirty little secret – I just barely give a fuck about IE 5 for the Mac. Seriously. The user-base is absolutely tiny, and those using it have many other, more viable options at their disposal. Because I know people like my mom, who uses IE 5 and doesn’t have OS X, I realize that a whole new browser is a scary thing. So, I try to be nice to IE 5 in that I want to make sure all the functionality is there. Beyond that, I just don’t want the design to look like total shit, but I’m not concerned with the pixel-precision in my Mac IE 5 designs. I design for my mom, basically. For IE 6 – I know the majority of people visiting any site I make is going to be using that browser, I make sure it looks pixel-perfect. However, CSS rollovers give me some issues, so I use a number of workarounds to make sure there’s not too much flickering. Thankfully, this flickering is almost non-existant in Windows XP, so again I don’t spend too much time worrying about the specifics in CSS rollovers. My advice to you – make sure IE 6 sees what everyone else does. If you leave out IE 6 – you’re fucked. End of story. As for IE 5 – there’s not a great deal of differences between IE 5 and IE 6, so far as CSS is concerned. The few that exist, there are many workarounds for. In any case, there’s only about a 5% marketshare for IE 5 anymore so you’re not going to go bankrupt if you fuck up the Box-Model Hack, for instance.

Safari

Basics :This is the browser I design for primarily. Like many Mac users, I’ve got about 6 browsers installed on my machine (both at home and at work), but Safari is my preferred/default browser.

Version(s) : I use and design for 1.2.4. Earlier versions of Safari were lacking many advanced CSS implementations, and few Mac users are utilizing a Safari version earlier than 1.2. It’s a small number to worry about, and they can always upgrade their browser to 1.2 (or use something like Mozilla’s FireFox).

Special Exceptions : Thankfully, Safari has few issues with it’s implementation of CSS/XHTML, so I never need to make Safari-specific workarounds and there’s nothing I would put on a site that couldn’t be implemented because Safari didn’t support it.

Mozilla’s FireFox

Basics : FireFox is fast becoming the browser of choice “for the rest of the web”. With a sustained 17-20% market share, this is definitely a browser you should take into consideration when designing sites. The only major issue I have with FireFox is that because it’s still in pre-release form (as of this writing we’re at 1.0 RC2, meaning a final version isn’t far off), I’m not sure how often its users are upgrading their browser and new features/bugs are being added and worked out with every version, so it’s hard to say “this works with FireFox” or “this won’t work with FireFox”.

Version(s) : Again, it’s hard to say. But, I keep my FireFox up-to-date as best I can. I’m currently using and designing for 1.0 RC2, since it’s so close to the final candidate that also makes it the safest version to design for.

Special Exceptions : Like Safari, there are few (if any) things that FireFox will fuck up, so there’s nothing I specifically avoid doing if I know FF users will be viewing the site at some point. However, because I know that anyone using FF also has another browser (like IE or Safari) installed – I know that if there were feature FF couldn’t support that made a site I was working on useless without, I’d just put a note to FF users to temporarily use another browser. It’s not a pretty thing, and certainly not something I’d prefer to do – but it’s my best advice to those of you doing things that for some reason FF won’t support and your site won’t otherwise function without.

Netscape

Basics : I’ve never been pleased by Netscape. Even when it was my default browser back when it was everyone’s default browser (like 1997-98), I always thought it was clunky, buggy, and ugly. Even to this day, in it’s latest version (7.2 as of this writing), it’s still the slowest, buggiest, most problematic browser out there. I can’t fucking stand it and the sooner it goes away, the happier I’ll be.

Version(s) : 7.2

Special Exceptions : My rule is this – if it doesn’t look right in Netscape, try to fix it. Make sure it’s at least useable and not an eyesore, then move on. You’re never going to get perfect pixel-precision, and perfect functionality in Netscape. Almost never. But it doesn’t matter. The few people who use Netscape as their default browser are using it in a corporate environment, and probably shouldn’t be fucking around with your latest CSS madness while at work anyway. Again – you should only really worry about functionality (meaning they should be able to get to every place on your site than everyone else can, nothing should be impossible for a Netscape user to use/see/interact with) and making sure there’s no glaring design mistakes. Netscape’s CSS implementation is such that it will pretty much adhere to most standards without much issue. If your user-base is Netscape 4.02, get a new user-base or encourage them to upgrade immediately.

Mozilla 1.0

Basics : This is basically Netscape + FireFox, but a little bit faster than Netscape and a lot slower than FireFox. If your site works in Netscape, it’ll work fine in Mozilla.

Version(s) : 1.0

Special Exceptions : Pretty simple – if it works in Netscape, it’ll work in Mozilla. If it doesn’t work in Mozilla, it almost definitely won’t work in Netscape.

Chimera

Basics : This was my default browser just before Safari came out. I liked its speed, features, CSS implementation, and interface. However, it’s basically just a slimmed-down FireFox (before FireFox existed), which is in itself a slimmed-down Mozilla, which is a work-in-progress version of Netscape’s next version (Netscape is the final result of any work done to Mozilla).

Version(s) : Doesn’t Matter

Special Exceptions : See the rules for Mozilla. I never work about Chimera because it’s got a very small user-base, and it’s going to display things almost identical to most other flavors of Mozilla-based browsers..

Opera

Basics : I think Opera sucks. Badly. I think it actually surpasses Netscape in the suck department. Not just because it’s the worst looking, and slowest browser I could find (at least as far as I’m concerned) – it’s also a Shareware browser. For those of you who don’t know what that means – it means you have to pay for it, or put up with ads. No other browser now or in the past has ever done that, why start now? Opera is used mostly by designers/developers as a test browser because it’s got really good error reporting and it’s not at all lenient about mistakes. Opera, as a company, also likes to complain about companies like Apple who use a similar rendering engine in Safari but don’t charge for it. That makes Opera mad. Well boo-fucking-hoo. The only thing Opera as a company does have going for it is that they made a damn good cellphone browser. They should stick with that, and stay the hell out of desktop-computer-based browsers.

Version(s) : Doesn’t Matter

Special Exceptions : Fuck Opera. Seriously. If someone complains that any site I’ve made doesn’t look right in Opera – I laugh at them. I’ve never met a single person who uses ONLY Opera on their computer. Again, the only people who even know about, much less use it for any length of time, are developers/designers. That being the case, they have other browsers that they’re perfectly capable of using, and know that many sites look like shit in Opera so they’ll just kick open another browser if they really want to see the content of a site. My prediction is that, other than on cellphones, Opera will never be mainstream – it’s too clunky, slow, and confusing for the average user and no one likes paying for an otherwise-free service/product.

In case my credentials are being questioned here, and you’re thinking “why the fuck should I listen to this guy?” I’ll give you a quick history of my design life. I’ve been designing for the web for over 9 years now. Up until 2001, I worked either as a freelance designer, or alongside other friends in companies we created in basements and shitty apartments along the West Coast. I’ve never had any college or schooling for design, and in High School I took it upon myself to not only teach myself designing for the web – but I spent the last 3 months of my senior year teaching web design to my Graphic Design class of which I was also a student.

When you’re freelancing, you don’t always have time to try out your lofty design ideals for each and every client. Sometimes they just want it right now instead of done perfectly right. Clients know nothing of other browsers beyond the one that they’re using – so your number one concern for browser compatibility is their browser. From there, follow the guidelines above. My freelancing days taught me to be very quick, thorough, and as bug-free as possible. Any difference of opinion, you will lose. Any issues with their website, they’ll come to you about. If they have a client who calls them to say “I’m seeing a black square in the bottom-right corner of my screen on your site” and they’re using a 10-year old Linux box with a grayscale monitor – guess what? You’ve gotta fix it. And since they know you’re a freelance designer, you’re not gonna sleep until that’s done. I once worked a 14-hour day, until 9am in the morning trying to figure out why one client’s client was seeing an overlapping table on a page and I had to set up a Virtual PC box emulating Windows 95 running Netscape 3.0 just to reproduce the result.

In 2001, I got hired as a web designer at a small niche-fetish porn company in Orange County. There, I learned in great detail how browser incompatibilities affected revenue in a big way. What I’ll write off in my private life as a measly 3%, they can point to and say “that’s $3,000 a month!”. It’s for this reason that almost every pornsite out there is designed with the look and feel of Geocities sites from 8 years ago. Table-based layouts will live on in porn until sometime in the hopefully near-future that we can say “fuck that 3%!”.

I now work for Vivid Entertainment, through a 3rd-party company named WebQuest, Inc. and I’m currently putting the finishing touches on the first-ever fully-standards-compliant, CSS-based adult affiliate program website. This might seem like no big deal to you, and maybe it isn’t to anyone but me – however, being the first to do anything in the adult industry is always a nice thing to be able to put on your resume (or just to use in casual conversation when trying to pick up geeky chicks).

It wasn’t until sometime in the last 6 months (at best) that I finally decided to take the plunge, throw out the tables in my layouts, and use CSS/XHTML when designing. AngryMF was the first full site that I designed using standards-compliant CSS/XHTML and also the first site I ever converted from tables to CSS. Designing sites according to this “new way of web design” has awakened my design senses and given me a renewed sense of excitement when designing websites. I was getting very bored of the whole thing for awhile there, but now it’s like I’m starting all over again.

I know it seems like I’m professing myself to be an expert at this when I’m really pretty new to it myself, but understand that not only have I been designing sites for the last 9 years (irrespective of the methods/languages/layout techniques used) – I’ve also kept up on web technologies and trends for the last 10 years, and I continue to do so to this day. Sites like SimpleBits, MezzoBlue and A List Apart have been an invaluable resource to me, and I visit each of those (and many others like them) on a near-daily basis. I don’t profess to be an expert with CSS or XHTML, or even web-standards. However, I would profess myself to be an expert in web design, and while I can still learn from others – there are many design colleagues of mine that come to me with their troubles of designing sites, especially when dealing with CSS.

Enough digression. The point is – differences in web browsers and their incompatibilities are likely to be a huge thorn in your side for many years to come, whether you’re a seasoned-pro, or a newcomer. However, utilizing the basic principles of which I’ve lived by for my designs in regards to the most popular browsers out there will help you quell your concerns and give you a lot more confidence when you launch your sites, knowing full-well that at least 98% of those viewing your site will have no troubles whatsoever and see your site exactly as you’ve intended them to see it.

If you’ve got more questions, or anything to add – leave your comments below.

Related posts:

1. Regression Bugs in Safari 1.3
2. Vivid Does Another “industry first”
3. Design Issues Part 2 : Everyone’s An Expert. Except You.