Clarity Ventures is an Austin, TX based consulting company committed to building innovative technology for our clients. Our software developers design powerful web-based tools to compliment your business processes. We start by understanding your particular industry through extensive interviewing and requirements analysis to ensure you always receive a completely dynamic, user-friendly, cost effective product to your exact specifications. Our strength is in our project management process, which ensures quality, consistency, and timely delivery for your website design, SEO, E-commerce, or Great Plains, CRM, or custom software solution.

After an extensive interview process, I’ve concluded with a great deal of confidence that Clarity is going places.  They are driven, talented and forward-thinking.  Clarity is staffed with the best personnel for the job from the top down, and they are well positioned to be an industry leading, world class development firm.

I’m excited to become and important part of this top notch organization and can’t wait to begin contributing to their already outstanding products and services.

If you are an existing client with an ongoing project please be assured that you will not be abandoned.  Although I’ll have to make some strategic adjustments to my schedule, I will make accommodations for all my clients to ensure that they continue to recieve reliable and affordable service.

Unfortunately I will not be able to accept any new clients at this time and until further notice.  Thanks for your interest and please feel welcome to contact me or follow my blog/twitter feeds!

All this monitor transversing does have a few problems though.  The most irksome is windows thoughtlessly floating in a phantom monitor.   The Windows OS, being helpful, leaves these windows and dialogue boxes where you left them (on a monitor no longer present),  rendering you quite helpless.

Here’s a remedy that works most of the time.

1)  Select the window any way you can.  (Alt + tab often does the job, but windows are selected by default when they are first called up).

2)  Use the key combination alt + space to open up the window controls dropdown (this will happen out of view, so you won’t know that its done anything)

3) Now press M on your keyboard.

4) press any arrow key.

5) Move your mouse cursor (do NOT click it)  around your visible workspace until the window appears.

You can see how this works by experiment with a window that is not in full screen mode that is in your view port.  This very useful technique took me hours of frustration to find and i still use it regularly.

Why should you hire me?

• I believe in you.
• I believe in myself.
• For me, finding the best tool for the job is a passion.
• I never stop learning, and never want to.
• I get excited about my work.
• I want to be challenged.
• I will tell you when I disagree.
• It is my firm intention that every new project I start will be the best work I have ever done.
• I am loyal, I am reliable and I am on time.
• I adopt your projects and treat your website as if they are my own.
• I’m never content with par.
• I compromise often, but stand firm on my convictions.
• I understand why organization and efficiency pave the way for success.
• I’m a terrible liar.
• I can’t stand to feel that I haven’t provided full value for your investment.
• I make websites that people will use.
• I understand that a website is a tool, has specific functions, and addresses specific goals.
• I relish creating long term relationships.
• My goal is for you to refer me believing sincerely that doing so is an act of kindness.
• I want to know more about your industry, your job and your goals.
• I love to collaborate.

I’ve been working on a particularly complex WordPress skin over the last few days and have been frustrated by naming convention.  The heart of the problem is this: I tend to run out of ideas for labels, and as a result I improvise.  Improvisation absolutely has it’s place in website design, but I can’t help but feel that improved standardization would make my code and style sheets more harmonious, structured and stylized.

Some structural labels are easy:

• Header
• Nav
• Footer
• Content
• Wrapper

Diving a little deeper gets a little more muddled and a little less standard:

• Container
• Module
• Main
• Sidebar
• Section
• Box

Some familiar labels are a bit more esoteric, I’m never quite confident in using these:

• Colophon
• Tertiary
• Masthead

Then of course there are countless modifiers:

• Right
• Top
• Center
• Sub
• Primary

Finally, the new HTML5 gives web developers some guidelines in the sue of new div elements:

• Header
• Nav
• Article
• Section
• Aside
• Footer

The remaining ID’s and classes tend to be purely semantic  (with the exception of templates and structured development packages which just produce nonsense labels more often then not).  Semantic, on-the-fly, labeling works, but it isn’t smooth or consistent and this method lacks the basic uniformity that makes editing familiar and accessible.  I think we can do better.

Goal

Create a standardized set of ID and Class labels that can be universally applied to a large range of projects.

Requirements

1. Markup labels must be semantic.

By this I mean developers should be able to infer what an element is likely to contain from the label itself.  E.G. Header typically refers to the top of a site, and typically includes branding and navigation.

2. Labels must maintain some flexibility.

Labels that are specific to a particular element in a specific website have no use in a standardized matrix.  “Hot-Air-Ballon-News” is rigid, whereas “Articles” maintains a degree of flexibility.

3. Redundancy should be addressed.

ID’s, unlike classes, should be unique in every instance.  Therefore if many websites are likely to have multiple Headers, the “Header” tag is not appropriate as an ID.  Classes will be a key part of any standardized system, but being able to apply ID’s to key structural elements is critical.

4. A modifier system must be addressed.

Modifiers can exist both as multiple classes (e.g. class=”nav right”) or as delineated but contained units (e.g. id=”nav-right”).

5.  There should be an inferrable hierarchy

Like html elements themselves, some labels should be clearly hierarchically related to others.  For example, the Body element contains all other elements.

I am anticipating a highly competitive market here in Austin, so I will be implementing an aggressive marketing strategy focused on developing productive and profitable long term relationships with small businesses.

I’m keenly aware that my strengths are face-to-face interaction and scalable,  affordable projects for businesses of all shapes and sizes.  I’m certain that here in Austin, like everywhere else, many small local businesses have dated, difficult to update and poorly designed websites.

Austin loves small local businesses, but to complete with massive corporations many of them will need to update and stay connected with their loyal clientele. I hope to tap into this market and expect that Austin will continue to be a welcoming and rewarding place to live.

The following is a brief step by step explanation of how I designed my most recent logo, including the various tools I used in production.

The Sketch

A rough sketch on graph or blank paper helps me get started. I may go through as many as 2 dozen quick sketches before I arrive at a concept with as much detail as the one included. Adding some rough guides will help me with proportions and reproduction later.

The Digital Grid

I scan my sketch, and then begin to create a custom grid for my design in Adobe Photoshop. I create guides where appropriate to assist me when I use the pen tool to begin to sketch out the actual lines of the design. The goal here is to get enough intersection to easily trace all the key elements of my sketch.

The Initial Trace

Next I use Photoshop line tool to outline my sketch using the guides I create earlier. The initial draft will be a simple outline with very little detail, just enough for me to get a feel for the actual proportions, make adjustments, then trace using vector tools.

The Vector Trace

Now I use the Pen Tool to create a detailed vector image. I can make adjustments on the fly, or adjust points and curves later on. A semi transparent shape layer helps me visualize the full figure. I use a different shape for each individual element, so I may have as many as a dozen separate shapes at this point. An appropriately sized grid also helps me alignelements precisely as I start to narrow down the exact look of my final logo.

Adjustments and the Final Outline

With all my shapes in place, I can assign them colors and make them semi transparent. I’ll continue to fine tune at this stage, and adjust how the individual elements fit together to compose the design as a whole

Illustrator Trace

It’s time to move on to Adobe Illustrator to compose the final vector image. I use my shape layer from the previous step as a background, then create my vector outlines in illustrator.

Font Selection

I use My Fontbook to browse my font’s and select one that looks right for this logo. I’ll add the actual text im going to use, and browse through till I meet something that satisfies me. If I don’t have one that suites me, I’ll browse for a new font from my font bookmarks.

Wrapping Up

Wrapping up is a bit of a misnomer, the final tweaking and adjustments of logo can take a lot of effort. Criticism is solicited, the design is tested in several formats and in multiple colors, and adjustments continue until everyone is satisfied. I don’t think this particular logo is quite complete yet, rather I’ll continue to make adjustments until I’m 100% satisfied.

As you can see it takes more than a great idea to make a great logo. As is often the case, inspiration is accompanied by quite a bit of experience and hard work to make a branding solution really work.

The new look should be easier to navigate and should do a better job highlighting my articles and posts. The new magazine style layout puts an emphasis on organization and takes advantage of WordPress 3.0′s featured image function to display thumbnails and feature images.

I’ve added a sidebar with a popular tab function to incorporate my twitter posts and make the articles easier to navigate.  The footer has also been updated to contain more information and links, again to ease navigation.  Finally, a brand new pattern library will be used to showcase some of my favorite design elements for inspiration and idea gathering.

I’ve added some new plugins, and the TwentyTen theme base will allow me to take advantage of many of the newer WordPress 3.0 core functions as I continue to tweak and expand on this foundation.

Active Plugins:

• Akismet
• All in One SEO Pack
• Code Colorer
• Contact Form 7
• Next Gen Gallery
• Recent Posts with Excerpts
• Sexy Bookmarks
• Sidebar Tabs
• Twitter for WordPress
• Yet Another Related Posts Plugin

Please design with a clear purpose.  Achieve a specific goal or goals that benefit you as the publisher, and the consumer as a user.  If that means having hundreds of links, images, or form elements so be it!  If you sell a product or piece of software show it off!  Provide ample screen shots and feature lists so that I can quickly make an informed decision.

While browsing for new RSS Readers today I came across bloglines.  The website is clean, simple, even “web 2.0ish,” but it is not useful!  Nowhere is an easy-to-view screen shot of the actual software.   A website that sells software or provides a web application based service should, at minimum, have multiple screen shots, a feature list and a price point.  Three tiny links in the header make for a grossly inefficient interface, one that immediately turns me off to this product.

No thank you, I will not register, login or ask for help if I can’t even clearly see what your service is!

Step 1 – Download and Activate the Plugin

Download and install the plugin from the link above.  (note: if you have display problems, you may want to revert to Version 0.8 or older).  Log in to your Admin Panel, click on the “Plugins” sidebar button, then activate the plugin.

Step 2 – Configuration and Setup

Expand the Settings menu in the sidebar then click on Frontpage Slideshow .  Expand the menus below the preview to adjust your settings.  Be sure to click the save button when you are satisfied with the appearance of your slideshow. [SinglePic not found]

Step 3 – Integration

Add [FrontPageSlideShow]  into the message of the page where you would like your show to appear. [SinglePic not found]

Step 4 – Creating Slides

You will want to designate posts as targets for your slideshow.  You can do this by applying new or current posts to a category labeled slideshow.  This will help you keep the sources of your show organized and accessible.  Edit a slideshow post.  Below the post you should see a new menu: “Frontpage-Slideshow Options.”  Add a title and optionally a comment, button-comment and slide link.  [SinglePic not found]

Step 5 – Adding Images

To add your image, click on the grey monitor icon next to “Slide picture”.   Find the image you want to add by using the tabs at the top of the menu popup (I prefer to use NextGen Gallery to store my images).  Regardless of your source, locate the image and click on the show link.  Leave all options as is, but change Size to Full Size.  Then click Insert into Post. Click on Update in the publish option window (top right) to save your changes.

Tips

• Size the images appropriately using an image editor before uploading them.  Although the plugin will fit the images into the show, they may be cut off or cropped oddly if not properly prepared.
• Having posts dedicated to your slides will make them easier to manage, but you will need some tweaks if you don’t want those posts to appear on your blog.
• If you have trouble deleting old images or content, switch to html mode and clear the offending text, then add your updated image.
• If you want to change your image in the future, simply filter your posts by the slideshow category, edit the post, click on the image you will no longer be using then click on the red Delete Image icon.  Next, follow step 8 to add a new image to replace the old.