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.

Older Posts »