User targeted design and development from mobile to desktop

Happy New Year 2015!

This year really flew by for us, busy busy busy. That’s a great thing, we really appreciate the support! After a little over 10 years of running a small business in this rapidly changing field of web design and development, most of the time we are just happy to still be able to do what we love on our own terms. We’ve worked with some great new clients over the year and continue to grow and interact with many of our regular clients.

To keep current in this industry requires one to continually invest time learning and experimenting with new technology and code practices. This year as we continue to work responsively in our development we have added a few wonderful new tools to our development flow, and I’d like to give a few quick shout outs, as most of these are open source, developed and shared by other professionals in the industry! How cool is it that we work in a field that is so supportive and innovative?

  • Sass – How did we as front end coders ever get by without it! Sass is an extension language for css which makes our css code much more efficient and easier to understand.
  • Bourbon/Neat/Bitters – Pretty much all of our websites and apps these days utilize these amazing mixin libraries from the Thoughtbot team. Over the year we have tested and deployed sites with frameworks like Bootstrap and Foundation, which are also both awesome, and can be more appropriate in some situations. In the end we find the Thoughtbot mixin approach is more semantically appealing, and leaves us with lighter, more efficient code.
  • Grunt – Nothing has streamlined out development process more efficiently than the addition of Grunt. While it might have a bit of a learning curve, the time is well spent, and you will be rewarded with things like having all your css and js compiled and minified for you automatically.
  • WordPress – WordPress continues to evolve as the most flexible open source CMS, with a huge community supporting it. This continues to make it the goto for us when building client websites (We have been working with WordPress for over 6 years, but I still want to give it a shout out!).
  • GIT – It took us a while to embrace GIT, and work it into our development flow (we’ve been in this business a while and sometimes major changes to the workflow are difficult to implement!). Now it is simply impossible to think we ever had to worry about writing over a fellow developers code on a cooperative project.

That wraps up my little shout out list this year, great stuff one in all! We look forward to a more productive year in 2015 and are excited to see what new technologies are revealed.

Cheers! Eric and Alex

We took a rare weekend vaction out to the Oregon coast! You should visit it sometime it is spectacular.

We took a rare weekend vaction out to the Oregon coast! You should visit it sometime it is spectacular.

What Exactly is Responsive Design and Do I Really Need It?

This is the question on many of our clients minds, and we thought we’d take a second to try and simply explain this new exciting design/development method in layman’s terms. The web design and development field is constantly growing and evolving, as you may be aware. Recently you might have heard about “Responsive Design” and you might be wondering what it is, and does your website do it?

The huge growth of mobile devices has had an impact on how we all perceive and experience this wonderful thing we know as the internet. We are now looking at websites, and using applications on a huge variety of screen sizes. As designers and developers we’ve had to react to this, no longer do we just have to worry about ie8, or the small variety of desktop screen resolutions…it’s a whole new ball field. Traditionally websites were coded at fixed widths, and we would check to see what the widest width was people were viewing sites on using their desktop computers, then we would tailor our designs to that.

When mobile devices took off in popularity, the mobile bowser developers had to figure out a way to show your website, hardcoded to a width of 800px in a much smaller screen. Their solution was to shrink the whole website down to fit (example to the right in the graphic below). The result of this is a nightmarish experience of pinching and scrolling around to navigate through any website. To remedy this in the past few years a few helpful tools have evolved (note my restraint in not using technical terms!) to help us target specific screen sizes and make certain adjustments to the website code which allows us to present a much nicer user experience across multiple devices.

This approach is quickly becoming standard practice for many websites. It is not ALWAYS the right choice, this depends on the needs of your website, and the type of traffic you get. We would be happy to take a look at your website and help you decide if it is the right option for you. You should know this though, mobile traffic is on the rise and will continue to constitute more and more of your visitors. Phone and tablet growth continues to skyrocket, and you want to make sure your site visitors are getting the best possible experience they can from your website.

img-responsive-compare

The graphic above quickly illustrates how much better the phone experience is when a site is coded using responsive techniques. Boston Accountability is just one of many recent responsive websites we’ve designed and built. We’d be happy to show you more, feel free to contact us with any questions you might have on converting your website code to make it responsive.

Website launch, Cherry Sprout Produce Market

Local PDX store owners Amanda and Katie contacted us to help them bring a new look and feel to their wordpress driven website for their produce market, Cherry Sprout.

We created a custom theme based on their logo and colors used at the physical store front. Knowing they wanted to better showcase the local produce they offer to their shoppers, the home page took on an entirely new look which focused on an image slider that was easy to update. Store hours and directions also took center stage, as well as social media connections. Now the home page also showcases posted information, divided into more useful categories and featuring titles and excerpts to show more info in less space.

Knowing many of their customers reach the website using a smart phone or other internet device, we also opted to make the design fully responsive, so no matter what device you view it on, you have a positive and appropriate surfing experience.

Click here to visit the live site.

cherry-sprout-produce-market-website-design

Website launch, Mirabella Salon and Spa

We were approached by OnThe45 Design Agency for assistance in developing a wordpress driven website for their client, MiraBella Salon and Spa located in Boise, Idaho. OnThe45 created a warm, inviting design for their client and based on the provided design comps BitClone developed a fully responsive custom theme for wordpress. The new website features multiple editable content areas and a variety of navigation interfaces, which all have to respond properly to different screen viewports.

MiraBella’s new custom wordpress theme is now live to the public and generating rave reviews from their clients.

Click here to visit the live site.

mirabella-salon-spa-website-design

December Babies

Both Alex and I are December’s children, and this year we decided to pack up and head out to Long Beach, Washington to celebrate our cake day. It was cold rainy and best of all pretty much deserted! One of the bonuses of Long Beach in the winter is you can drive your vehicle on the beach, which is great when it is cold and rainy. We had a blast and stayed at the Inn at Discovery Coast which was quite nice. Merry Christmas to all you wonderful people who have helped us keep this small company going for over 7 years now! Huzzah.

the seagulls are ferocious!

Bitclone

Website launch, Audios Amigos

When the musicians from Portland’s own Audios Amigos contacted us to create their website, we were excited. Getting to design a website for an awesome western surf instrumental band, who recently released their first EP – The Reacharound, which features artwork from Chris Cilla – Fun! Bitclone created a custom wordpress theme, and utilized the Reacharound artwork to good effect. You can listen to some of their audio tracks which feature Lucky Brown, purchase a digital copy of the Reacharound EP, or purchase a hardcopy of the EP to be mailed to your lucky self. Their custom theme also features a sticky navigation bar, so no one has to scroll back up to the top of the page to see the primary navigation.

Click here to visit the live site.

My laptop battery is so swollen: trapped in right click hell

Yep, we are having a scorching August here in the Pacific Northwest, with what feels like record temps. You know who hates this damp steamy heat? My MacBook laptop. How do I know? Well, late yesterday afternoon my wireless mouse stopped working. Actually the mouse controls seemed to be locked in some sort of right-click nightmare where I could not escape the webpage I was on, nor could I close the page. Initial thoughts: time to change the batteries in my Targus. Fresh batteries inserted. No dice, still trapped in right-click hell. Due to a similar incident earlier this summer, I knew what the issue probably was. Swollen laptop battery. Our PHP developer ran into this exact right-click entrapment during one of the first hot spells here at the studio. Seems the old swollen battery is a known Mac issue, and removing it from my laptop alleviated the right-click hell immediately. Now I am running battery free, which will be fine provided we don’t lose power and all that. Seems it’s past time to replace my MacBook laptop battery.

Website launch, EcoLloyd (Lloyd EcoDistrict)

Sarah Heinicke, Executive Director of the Lloyd EcoDistrict approached the BitClone design and development team to create a new website for the emerging inner Northeast Portland Lloyd neighborhood. We worked with her to create an appealing design and branding for her vision of EcoLloyd. Focused on a sleek, uncluttered site design with a home page image slider to show off the the Portland Lloyd district visually, the new website is up and live to the public. EcoLloyd is housed in the wordpress content management system, ensuring Sarah and her staff will be able to easily update pages as new information regarding the Lloyd EcoDistrict becomes available. With a focus on breaking district news relevant to the Portland Lloyd quarter, we created a custom post type for the News section of her website.

What the heck is the Lloyd EcoDistrict you ask? Per their nifty new site – “The Lloyd EcoDistrict works to move the business district toward its “triple bottom line” goals. Triple bottom line is a way of measuring progress in terms of financial, environmental and socially just outcomes.”

Check out what’s happening over at EcoLloyd.

Website Refresh, WordPress Theme Redesign for Birdfight!

We recently did a major design and code overhaul to the hip, eco minded,  blog site Birdfight.com. The challenges presented were to roll out a new WordPress design to a live site that has over 4 years of content. The process we usually use (for those of you interested) for this type of job is to set up a local development site and export all the data from the existing WordPress database. One of the many reasons we love working with WordPress is that is makes this task unbelievably easy, which will also help you back up all your data…you are backing up all your data RIGHT? Click here to visit the live site.

New Facebook plugin for WordPress…blarrgh.

Facebook has released their own plugin for WordPress which on one hand is GREAT…However, as is pretty much everything Facebook developer related it is confusing to work with and buggy as a warm wet Oregon summer evening. We have the plugin up and running here in the studio and have been working with the various functions to test them out and see what they offer. On the surface this appears to be really cool, as ultimately it will make connecting and interacting with Facebook a bit easier for everyone, which is a pretty popular request from our clients. Here is the link to the official plugin page, if you need help setting it up give us a holler.

Website launch, autoctona design

We were approached by Alesandra to help her refresh her current website design and develop a WordPress theme. We were able to work together with a limited budget, and help create something that was both aesthetically loyal to her keen design sense, while offering her all the functionality of a WordPress CMS. The main challenge was creating some templates for some unconventional layouts that would allow the client to dynamically update content with various image sizes.  We really enjoy working with talented artists, especially ones located right here in Portland. You should take a visit to her website to learn more about Autoctona and view some of her amazing work.

Upgrading to WordPress 3.2!

Well we just pulled the switch here and upgraded to WordPress 3.2. It’s a pretty hefty upgrade, and our Media Temple DV server is always a bit finicky when I run WordPress upgrades, however all went pretty well (You can feel free to contact us if you need help upgrading your WordPress system). The new dashboard is quite a big change, and a few things to note with this upgrade.

The WordPress team has officially dropped support for IE6 (hooray I say) and they now include a little browser check right there in the dashboard to help give you a little poke if your browser is in need of an update (you’ll see in the screenshot my version of Firefox is outdated…yes I know, shame on me, I was waiting for a 1Password update). Next thing of import, your server will now need php5 AND mySQL 5. This will require those of you running older Media Temple Gridservers to upgrade. I’m sure MT support phones have been ringing off the hook, and they have already been addressing the issue diligently. As a matter of fact they just posted a video to Facebook which should help you on your way.

Last bit of advice should always be the first bit of advice. BACK SHIT UP! You’ll feel better about the whole process.

Here is a screenshot of the new Admin Dashboard, pretty slick!

Wordpress 3.2 Dashboard

WordPress Website for Portland Film “Rid of Me”

How cool is the local film scene here to have the filmmaker/acting team of Katie O’Grady and James Westby? Their latest film Rid of Me was recently screened to great reviews at the Tribeca Film Festival. The film features all sorts of local Portland talent romping through a romantic comedy about a young woman named Meris and her struggles to fit in. The film stars Katie O’Grady and we can only wonder why she has not broken big time yet…We were contracted to take their poster artwork and turn it into a fully functional WordPress CMS with a news section they could easily update. We worked in a rotating slideshow to give visitors and instant feel for this wonderful film. Click here to visit the live site.

Rid of Me WordPress CMS

Website Launch for Deep Cello Portland Coffee Roasters

We worked with Portland designer Giuseppe Lipari of Studio Lipari and the Deep Cello coffee crew to set up an online presence with this new ecommerce website. The biggest challenge for us was we needed to craft a good shopping solution using phpurchase which was their plugin of choice. You can order their delicious hand crafted beans directly from the website and have them delivered to your doorstep! Studio Lipari provided us with a beautiful design that captures the hand made quality of the product crafted by local roaster Justin Kagan (also one heck of a cellist with the Portland Cello Project). Beam yourself over to Deep Cello and learn what they are all about….good people making good coffee with lots of love.

New Website for Hank Topless, Country Musician

Back when we lived in sun soaked Tucson Arizona I had the pleasure of playing a few gigs on bass with Topless Opry. An honest down and dirty country outfit led by the cantankerous and deep toned Hank Topless. His dark songwriting and accomplished guitar picking have carried on into his solo act as Hank Topless, and we recently helped him design and launch a new website with help from WordPress and the excellent Gigpress plugin, which helps musicians manage and post shows and tours. If you’re ever in Tucson and you see a tall dapper cowboy with a gruff voice singing the country blues over at the Red Room or Congress…buy him a cold one.

Hank Topless WordPress Website

Hard Drive Hijinx

Well geez, wouldn’t you know it, computers take the best opportunities to mess with us. I was away on tour with Miss Lana Rebel down to Tucson, and Alex was very competently holding down the fort when all of a sudden her trusty old macbook decided it wanted to create a bit of excitement for us. Hard drive kaplooey! Anyways thnx for your patience we are all back up and running and will be catching up with everyone shortly.

Bitclone

Misty Mountain Morning

The wind last night has cleared away all the pea soup up here in Forest Park. It is interesting to see how the dynamics of our surroundings have been altered now that it is all gone. The leaves have fallen, the trees are nude. Here are a shots I snapped up on Skyline a few mornings ago, it was a thick muddy ride to get up there, but the fog was just as thick.

Team Bitclone moves to tree fort!

Hey Friends, it’s official we have moved our home and office out to the wonderful Forest Park Linnton neighborhood.


View Larger Map

So please update your address book for us if necessary. Bitclone LLC physical realm base camp is now 8946 NW Mills, Portland Oregon 97231. It’s been a big and refreshing change for us to get back to nature. There are many amazing trails up into the woods, and we’ve just begun exploring it all! Penny (our dog who thinks she’s a chicken) has been loving the hiking and the wildlife in general. Here are a few pictures of the new diggs, drop by and visit sometime.

The Bitclone process of building a dynamic WordPress powered website!

It’s amazing how fast the world of business, and seemingly the world in general, has changed in my lifetime. This is, of course, heavily due to first the personal computer revolution, and secondly the internet boom. I graduated from Boston University in 1987 with a graphic design degree which gave me the ability to hand-paint fonts! Needless to say, it quickly became obvious to me that unless I started learning how to use computers I would be left behind as an artist and a designer.

In addition to designing and developing websites I also run a small business, which has opened up a whole other area of evolution and education for me. I interact directly with every client, and when I am approached by a potential customer some of the first questions are generally:

  • “Help me understand the process of building our new website.”
  • “How long does it take?”
  • “What are the costs involved in this?”

So let’s hope this post will begin to illustrate one of Bitclone’s basic processes – developing a WordPress CMS-based website. It should provide something of an overview, and help you get started in thinking about your project and some of the questions you’ll need to answer. We feel it is important to point out that every job is different, and part of our goal is to help you maintain your company’s unique identity among your competition. Having said that, there are some common points of focus we have identified through experience, and can discuss here.

(more…)

Older Posts »