Beautify BatchBook CRM with GrayBook

I can’t say enough nice things about BatchBlue’s web-based customer relationship management software, BatchBook.  Its 37signals-ish ease of use — along with the killer integrations and brand spankin’ new iPhone app — make it a fierce contender for best small business contact manager.

However, it is blue.  Perhaps a bit too blue.  That’s not particularly surprising considering that the company’s name is BatchBlue, but it can cause UI-obsessed webworkers like yours truly to gravitate towards sexier CRM’s like Capsule and Highrise.  Determined to partake in the power of BatchBook without sacrificing aesthetics, I spit out nearly 400 lines of raw code and gave my favorite cloud-based contact manager a face-lift.

I finished up my dark and clean BatchBook theme and named it GrayBook.  Why, you ask?  Because BatchGray just sounds weird…

Here’s a screenshot of BatchBook’s Dashboard before I tweaked it:

And after:

And here’s a contact page prior to my tweaks:

And after:

How It Works

When you browse any well-designed webpage, a special collection of code — called “CSS” or “cascading style sheets” — controls the “look” or “styles” of the website.  The fonts, colors, and layout of this website are all determined by these simple lines of code.  Your web browser (e.g. Firefox, Internet Explorer, Chrome, Safari, etc.) reads the CSS and makes the website look pretty.

Since your web browser does the dirty work of interpreting code and beautifying web pages, you can change the look of websites by changing the code.  This is called a user style — several lines of raw code that change the appearance of a website within your browser.  It literally allows you to browse in style.

Although several web browsers support user styles, this tutorial only covers installation in Firefox and Chrome.  If you want to use my Graybook theme in another web browser and don’t know where to begin, post a comment and I’ll see if I can help.

Installing GrayBook In Firefox

To install my BatchBook theme in Firefox, follow these instructions:

  1. Click here and press the big green button to install the Stylish addon
  2. Once the installation is complete, restart Firefox
  3. After restarting, click here and press the “Install with Stylish” button
  4. Go to your BatchBook account and check out your new theme

Installing GrayBook In Chrome:

These instructions are almost identical, yet somehow slightly easier:

  1. Click here and press the big blue button to install Stylish
  2. Click here and press the “Install with Stylish” button
  3. Wow, that was fast!  Check out your new BatchBook!

Simple enough?  If you have any questions, comments, or suggestions, let me know in the comments section.

New Web Design – Entreo Live

Entreo Live (coming soon to entreolive.com)

Entreo is a local reggae artist that thrives on his Jamaican and American roots, which are a central theme of his music. EntreoLive.com includes a community, bio, blog, CD store, gallery, event info, custom flash animation, and the Joomla content management system.

The website is completed besides a couple shopping cart tweaks that require the client’s assistance.  It is likely to launch any day now.

New Brand, Same Swagger

All of my long-time clients know that my brand has changed a lot through the years.  In 2000, I started my web design firm under the name “Web Design Delivered.”  I quickly branched out into all other website services, including hosting, domains, maintenance, and marketing.  This change in services was accompanied by a name change to “Web Site Delivered.”

I’m finally at the point where I can expand to meet my original goal.  My clients know that I offer the best web design service in the area and beyond.  I deliver a phenomenal value, excellent support, and my trademark back-breaking hard work.  I am now ready to transform my company from a small web design firm to a state-of-the-art marketing company (that offers state-of-the-art web design, of course).

New AdVenture Media

My new brand will offer precisely what your small business or start-up venture needs:

  • Complimentary marketing analysis and planning
  • Website design and management (domains, hosting, design, maintenance)
  • Graphic design (company identity, advertisements, logos, stationary, business cards, etc.)
  • Marketing solutions (search engine optimization, social networking campaigns, etc.)

New AdVenture Media offers the edge your company needs to thrive in an economic downturn.  I’m working on its logo, branding, stationary, and an absolutely explosive website.  Subscribe to my RSS feed and I’ll keep you posted.

New Web Design – Nu-Generations Ministries

Nu-Generations Ministries (nu-generations.org)

The Joomla CMS web design for Nu–Generations Ministries includes a forum, prayer center, info about the ministries and church functions, guestbook, photo gallery, and much more.

You can take a look here.

New Web Design – Lacrosse Coaching Assistant

The Lacrosse Coaching Assistant (topstarlacrosse.com/coachingassistant)

The Lacrosse Coaching Assistant is a collection of computerized lacrosse coaching tools created by the renowned local coach, Carl Runk. This website markets that product. He also has gotten a book published under the same name.

It features a content management system so he can easily make updates at the push of a button, along with a shopping cart and a great CSS/XHTML compliant theme.

The website is up and available here.

New Web Design – Lovette’s Lovely Remy

Lovette is a client of mine and owner of Lovette’s Lovely Links, which offers hair extension services.  Her new website is for her line of hair extension products, Lovette’s Lovely Remy.  Her website includes a shopping cart, the Joomla! Content Management System so that she can easily make updates, a flash gallery, and other great features.

ishot-17.jpg

You can take a look here.

iPhone & Mobile Site Versions Launched

mobile_site.PNG

You can now browse DerekConjar.com from your mobile phone!  I even have a unique site just for iPhone browsers.  Simply type DerekConjar.com into the browser’s address bar, and voila!

Update: I recently launched a newer version of the site and have disabled the iPhone version, since the new interface is even better for iPhone navigation.  Enjoy!

New Web Design – SecuredReturn.net

Today, I made the finishing touches to SecuredReturn.net, the online home of Southfield Properties LLC, a local real estate investment firm. The site features the Joomla! Content Management System, a member’s area, and much more. There are some parts of the site I was hesitant to design (i.e., the plain one-column layout and the pixelated banner), but the customer is always right.

Southfield Properties, LLC (securedreturn.net)

You may view the website here.

New Web Design – Blondell & Associates

I just finished the website re-design for Blondell & Associates, a law firm located in Essex, Maryland. Todd Schuler, a client of mine and member of the Maryland House of Delegates, is an injury lawyer with Blondell & Associates.

Blondell & Associates (essexinjurylaywer.com)

The site includes a beautiful template design, a custom-designed logo, the Joomla Content Management System, and some other cool features.

You can view the website here.

Can You Do the Website Yourself?

So, you’re looking for a web site?

Odds are, you considered it. They say that if you want to get something done right, you do it yourself. Use this survey to determine whether or not you’re capable of designing your own web site.

Are you good at graphic design?
If you want a professional web site, text and tables just don’t cut it. A picture is worth 100 words. You’re layout needs to possess excellence in beauty and design. If you’re not a wizard in Photoshop, Imageready, Freehand, and Fireworks…good luck. You’ll need it.

Do you have the latest software?
Unless you are an absolutely brilliant web coder, you will need more than Notepad to get the job done. One of the top web design tools is Microsoft Frontpage, which is a tool that I will never, ever, recommend. What do you need? The latest version of Adobe’s web and graphic suites, most likely. Oh, and you have to know how to use it.

Do you know how to create beautiful templates?
HTML is dead. R.I.P. If you want to create a professional web site that loads quickly, looks great, and performs well in search engines, it better be CSS/XHTML, and up to Web 2.0 standards. Stay away from tables! Don’t even mention frames. Those web sites were never alive in the first place to be dead. To make a great template, you should make your graphics in Photoshop, make your graphical layout in Fireworks, and make your CSS template in Dreamweaver. It’s never more simple than that, although it often is much more complicated.

Do you know how to make it work?
Do you know how to integrate CSS, XHTML, Flash, images, text, forms, multimedia, and even content management systems in your web site? If you don’t, leave it to the pros.

If you are interested in a web site but do not have the technical skills to do it yourself, feel free to contact me at any time for a consultation.