Every web site has to contain a specific message, a reason for users to visit. What could make your accounting website different to the next? The design, clear message, ability to be found or perhaps a webapp your clients could use? We studied several hundred web sites of accounting companies and analyzed few key quiddities we found. Here are then six and a half simple rules to follow when designing a web site for an accounting company.

1 Which accounting services you provide?

Most accounting sites have a list of services they provide. From visitors perspective, our guess is that majority of people unfamiliar with accounting specific terms have to guess if your accounting firm is a good fit for them. The list of services is good, however, a prominently exposed list accompanied with a brief description would provide much richer experience. Moreover, it will help drive traffic to your web site from search engines.

2 Who´s working for you?

Visitors like to know who you are, watch pictures of your employees. A trustworthy relationship between bookkeepers and entrepreneurs is important for keeping trade secrets and other sensitive information for leaking, hence make sure to include a section which gives even a brief overview of your staff. A mini biography on each staff member adds some personal touch and establishes necessary credibility of your firm to prospective new clients.

3 Educate your clients

Tax Offices usually release new rulings on issues relating to taxation legislation regularly. Most likely your clients don’t understand these as well as you do. They are waiting your professional opinion on the matter and how it could impact or benefit them - an opportunity for a newsletter content and publishing it on your web site. Strenghten your relationship with your clients.

3,5 Checklists 

Another useful tool for clients and even prospective clients is providing a collection of simple yet essential checklists or guides they can use for particular tasks. Smart companies use their website as a passive customer help tool, why don’t you?

4 Arm your company’s site with an online application

Leverage technology because it is now more accessible than ever. There are so many ways to create something innovatively useful for your clients and drive traffic to your site. It can be an essential tool, calculator, interaction model or whatever people find handy. Think what could add value to your service, differentiate you from others while reducing your workload. 

Software is moving to the web and it is now possible to make applications much simpler to use and to live with. Find great design companies to collaborate with business development. You rarely need an IT guy in your company these days. For easy maintenance of your site, ask for an easy content management system with no need for a HTML programming knowledge.

5 Write well and be elegant in style

Remember, driving traffic to your site is not an easy task. Take that extra effort - provide good content, explain balance sheets, profit and loss statements etc. Keep it simple, clean. People will find it sooner or later and link to it. 

If your site’s appearance looks like out from the 90’s then change it. It feels like stepping into an untidy office. Visual appeal accompanied with easy navigation can make or brake the good first impression. And you can only leave the first impression once.

6 Career possibilities

Every company would like to attract the brightest heads. In a competitive recruitment market your presence in the web should be used wisely. University graduates are scanning your web site and make their inital decision based on emotions (or known brand name). 

In other industries we´ve found effective to include employee benefits, possibilities for professional development and training. Moreover, consider the social aspects of working for your firm. Photos of your office evoke positive emotions. To eliminate confusion, you may also like to have a positions available section.

Conclusion

So, there were six and a half golder rules for creating a better user experience for clients of accounting companies. Human computer interaction has indeed so many interesting facets and would be long journey to describe all of them. Therefore, we selected the ones that we find are crucial for engineering a remarkable online experience.

Well designed web site (or web application) adds credibility, hence creates better bottom line for your business. User experience design reduces excessive features which miss the needs of the user while incorporating business and marketing goals.

Loading mentions Retweet

Hey, it is spring and we have something coming...

We have been busy and here's why. As we all know, web sites naturally evolve over time. What often started as a simple brochure-style information carrier, eventually grows and becomes integrated into an organization’s workflow. Nowadays web sites are closer to being a small software bundles than merely a digital brochures. Redesign is a good thing addressing issues like improving user interactions, planning better navigation and implementing new techniques. 

However, while many industries have learned to utilise near endless possibilities coming with more powerful programming languages, better tools and expertise in visualization and information architecture, there are those unfortunate who need some guidance. We figured, maybe they have no idea where to look for help or how to even evaluate results. One of the best ways here is to show them their own materials transformed by professionals and see if it creates an impact.

So, what is this REWORK33 experiment about?

REWORK33 is a survey kind of case study inviting accounting companies around Göteborg into a hopefully constructive dialog. We want to know how they feel about new technologies, how they look for their design partners and if they even care at all :)

The Goal

For a better bottom line, web sites should grow like companies do. Our mission is to help 33 accounting companies by providing them guidelines for a better user experience and a 1 hour reworked graphical mock-up of their current web site. Also, to demonstrate what a talented team can do in a short period of time.

The Background

We studied several hundred web sites of accounting companies and analyzed few key quiddities we found. Even though accounting firms are notoriously perceived as having conservative outlook, rather poor communication (well, as most corporations), it was surprising how some firms stood out. No fancy graphics or animations - just a really clear, elegant look and feel.

Don´t be surprised if you hear from us ;)

Loading mentions Retweet

Phase: LISTEN

Few months ago we were found by a company called CIT Energy Management. Being part of the larger group known as Stiftelsen Chalmers Industriteknik they felt the time was right to have their own distinctive face and feel towards clients - a web site tailored for their specific needs.

Chalmers Industriteknik is the interface between companies and academia. Through them, companies get access to a broad, cross disciplinary spectra of state-of-the-art competences within science and technology.

CIT Energy Management works with issues of energy use and interior climate in buildings of all kinds, from residential housing to advanced laboratories. Their goal is to collaborate with the client in handling these issues to achieve long-term efficient use of energy in both economic and environmental respects, while also securing the clients interior climate.

Initial meeting

First meeting was very much like a dialog and an opportunity to share ideas. We were listening carefully and noting down everything about the requested look and feel of the site. Since there was a small web application development involved, we needed to know who are the targeted users for this web app. 

A quick mock-up

We were competing with other design companies to get the job, hence for a rough showcase mock-up we studied Energy Management’s marketing materials in order to define color scheme and similar image.

It turned out to be a good idea to put some more effort on finding decent direction, since we happened to be selected to carry on with the project.

Phase: CREATE

In Cannedapps we work iteratively. We have noticed that it is more efficient to show each significant step to our clients before proceeding to the next. Here is a rough outline of the process for CIT Energy Management’s web site:

01 Scenarios of use and wireframes

Before creating wireframes and sort of moving on from the initial graphic mockup, we analyzed couple of use scenarios of the future site. First, it would be a platform for many scientific publications (sorting and search) and second, a communication tool between EM and their clients. 

02 Graphic mock-ups

Now that we got most of the page wireframes signed off, it was time to reshape previously designed graphic mock-up. Graphic mockups are realistic images of a user interface (web page). They are refinements of the previously made conceptual user interface. Graphic mockups do not function, they are merely static screen drawings, looking like the real thing.

03 Quick task analysis for file management application

Task analysis simply means understanding users’ work. During task analysis we investigate sequence and character of a user’s actions and decisions to achieve a goal. We use rapid task analysis to make user experience design process suitable for almost any project. Good emotions arise when things are easy to use, aesthetic and useful.

04 Model development and implementation 

After our graphic mockups were approved, we started building the real thing. That, of course, means cutting mock-ups into pieces and sewing together again with the help of HTML (not an acronym for "Hey That's My Lighter!") and CSS (HAML http://haml-lang.com/ and SASS http://sass-lang.com/ to be more precise). 

Here is were the ease of use and flexibility of Sandals really comes into play. The core of Sandals is good enough to allow integration with other custom web apps - in EM’s case the web based file upload and file management application.

05 Launch

Energy-management.se has been live for a few weeks by now and we have been able to make changes based on feedback. It is always good to test and keep an eye on the site for a while to learn what people think works and what not. Click the image below to visit site.

Loading mentions Retweet

Timing is one of the most important things in business. To address that issue, there are companies selling companies off a shelf helping you start changing the world quickly, hence saving you time and tedious paperwork.

Imagine, if you were on the market and searching for a company like this, what would you look for? Price list, speed of the service or something else? We recon, one of the key qualities you are looking for is the credibility of that company.  

Guys from AktiebolagNu, who contacted us few weeks ago, are running a solid business and are really nice people to work with, however, their web page couldn’t match their profile. It just didn’t look serious enough. They knew to sell better they need something more.

Phase: LISTEN

This was a rather quick polishing project, since back-end of the site was fully functional. A simple yet professional looking outcome that would appeal to business people was a must. Furthermore, the logo had to be redesigned and a new color scheme suggested.

Phase: CREATE

We started sketching down ideas for a new logo immediately, however, we could only spend up to 3-4 hours for a logo, so it made sense to divide it for several days and let it settle in between. Iterative process as usual. Fortunately it came out rather good.

We found brown with different shades would be suitable base color for their business image..

.. and eventually we got to a decent graphic mock-up to present. 

Layout had to be simple, conventional and showing 2 kinds of services prominently. We were satisfied to discover that shades of light gray in hand with selected brown color gave a professional yet relaxed feel to the site. To visit, click on a picture above or hit www.aktiebolagnu.se

Loading mentions Retweet

Here is a problem that I have had for some time with Photoshop. When I design something in PS and hit "Save for Web & Devices" to export web safe portable network graphics (PNG) file then it always appears lighter (washed out) on the web than I originally see it in Photoshop. For example, notice the difference when viewing the gradient in PS (left) and on the web browser (right).

It came out that it's a simple color balance issue. When an image is created in RGB, PS embeds a color profile to the document to keep colors correct in color managed applications. But, the Internet isn't color managed so when image is saved for web the color profile is stripped and the colors shift slightly.

All browsers assume an RGB image is sRGB and many formats like GIF and PNG don't support color spaces. This problem only affects those viewing the image on a Mac, not Windows since Windows, and browsers on Windows aren't as picky about color balance (gamma 1.8 vs gamma 2.2), and they are much more forgiving when using sRGB.

Solve it

Knowing that above, I now needed to get my Photoshop showing the same colors as they appear on web browsers on a Mac (PC was okay, they just come a little darker then).  

Firstly, to be safe I needed to change PS color settings from Edit > Color Settings and changed my RGB working space to "sRGB IEC61966-2.1". 

Secondly, I made sure I was working on Macintosh RGB proof color space by View > Proof Setup > and select Macintosh RGB or Monitor RGB when I work on a Mac. That way I create artwork correctly from the beginning. And that should do the trick!

Good luck!

Tip: You can toggle between Windows and Macintosh proofing views by pressing "Command" + "Y". 

Note: If you work on a Mac but have your monitor calibrated to 2.2 Television Gamma, then you probably don't experience that problem.

Loading mentions Retweet

Imagine a world where residual biomass and by-products are cleverly converted into a valuable carbon neutral solid biofuel – the Bioagro pellets. Well, in the heat of discussions about carbon footprint and biofuels in general, there is one innovation based company in Sweden providing these sustainable conversion technologies.

OUR TASK: Make it easier to update

The Bioagro project initially started out as part of EU Life initiative. Ecoera company had a project site which had to be converted to work on a more manageable platform. At the time, the www.bioagrolife.com project overview site didn’t have any CMS system behind it. We were asked to simplify the content update process and to create a more modern feel before the project will be commercialized.

In Cannedapps we work iteratively. We have noticed that it is more efficient to show each significant step to our clients before proceeding to the next. Here is rough outline of the process for Bioagroenergy.com redesign:

01 Old site audit

Before going to work on the new version of Bioagroenergy.com we took a closer look at what they already had and what the main problems were with current site. Firstly, it contained too much, too small text. Secondly, it was very difficult to update. We figured that Sandals would fit right into place here.

04 Scenarios of use >> Scenarios of use in the future

At present the main purpose of the site is to give information about the technology and a brief overview about the project. Soon, however, it will act as a sales gateway for Bioagro pellets. In the next larger iteration there might be a web application developed for that purpose.

06 Wireframes

First ideas usually appear on napkins, inside notebooks or just on casual printing papers. I usually have several A3 papers in front of me all the time.

When the main concept has had some time to consolidate, it’s usually a good time to turn to more advanced wireframing applications. Cannedapps likes to use Hotgloo for digital wireframes.

07 Graphic mockups The client requested that the European Union-like blue and yellow colors would remain dominant. Graphic mockups are realistic images of a user interface (web page). They are refinements of the previously made conceptual user interface. Graphic mockups do not function, they are merely static screen drawings, looking like the real thing. You guessed it, it was now time to open Photoshop.

08 Model development and implementation After the graphic mockups were approved, we started building the real thing. That, of course, means cutting mockups to pieces and sewing together again with the help of HTML and CSS (HAML http://haml-lang.com/ and SASS http://sass-lang.com/ to be more precise). To fill the updating criteria, we suited our preferred content management system – Sandals, to work with Bioagroenergy.com.

09 Launch Bioagroenergy.com has been live already since December, 2009. More content is on the way from the client who now uses Sandals to make fast updates and publish news.

Loading mentions Retweet

If you are familiar with Zmags, then keep on reading. Zmags Publicator is where ICM takes place. The core of Zmags Publicator is the PDF conversion engine that allows you to convert a static PDF file to a live page-turning publication. Once created, Zmags Publicator gives you more than 75 features ranging from different ways to customize or add rich media, managing and archiving your collateral and analyzing the readership as results get in.

From users' perspective

Having used Zmags ICM solution about a year for various projects we noticed one thing. It's easy to make a digital publication in Publicator but rather troublesome to insert links to various locations later. Especially when you are a reseller and happen to manage bigger client portfolio.

Inconveniences start when updating already published catalogs. Sometimes it was easier to replace whole publication instead of replacing single pages. If you happen to manage couple of product catalogs then you know a quality product catalogs share. Prices tend to change. Sometimes they even change several times in two months.

Well, it made us thinking..

Active Slot

What would happen if web page and publication are not directly connected? Rather than having unique Publication ID to distinguish between publications, there could be one additional layer between single publication and a web page. 

For example, instead of inserting publication ID-s into code, one could connect "active slot" with his web page. Once it is done you could edit and replace publications inside Publicator - whatever their ID-s are.

Why? It seems easier to move new created publication into "active slot" once you are in Publicator anyway. Digging into the code in your homepage would be only needed for additional publications. It would save time for resellers and might be less daunting for average user.

Another advantage is, that slot ID would remain the same meaning that all blogs and other pages linking into your publication would automatically stay updated even when you change your publication inside Publicator.

Cheers and keep up the good work, Zmags!

Loading mentions Retweet

Life-cycle of a start-up is very much like it is for a person. It all starts with a fertile idea.

First, a seed is being sowed by the founding fathers. Both, you and your partner, know that it will change your life forever.

After a period of childbearing your idea, a start-up is born. Like an infant, your company is still very small and weak and all this new, dangerous and unpredictable world is doing is making it cry. First steps and endless series of experiments are all an essential parts of growing up. Sooner or later, the same way it is time for a baby bird to leave nest, it is time for you to move out.

Until now has CannedApps, like any other start-up, been abusing Kevin’s cozy bedroom-kitchen-living room to accommodate our creative minds. Finally gets Kevin back his privacy and CannedApps a new home to enhance creativity. 

We were really lucky to find this perfect little studio at “the Manhattan of Gothenburg” and move in already the next day after the first visit. It just felt right from the beginning.

View Larger Map

Our new home is now at the corner of Kungsgatan, one of the most known streets in Gothenburg, and Ingenjörsgatan, a place where kings meet engineers.

We are not alone. Our neighbors are also young entrepreneurs from different fields, favoring new contacts and communication. It’s the best, most creative environment.

Sometimes we still do get lonely, connect us via makefriends@cannedapps.com or visit us at our new address:

CannedApps HB
Kungsgatan 4
41119 Göteborg

Loading mentions Retweet

It's not good enough anymore to be "pretty good" at everything. We think the ever increasing clutter on the web requires one to focus and quit everything else. In 2010 you should be most of something: most friendly, most accessible; most flexible. 

Now it makes sense to have wider knowledge but concentrate that wisdom. It used to be common, however, that web design companies knew something and tried to apply that to every task in hand. It was acceptable that one template of a website could be used for any type of business. Is it now? 

Web pages are starting to act more like web applications. And applications are used by people and need to be designed for people because people get lost. That is why we do interfaces and the strategy behind them. We decided not to follow temporary trends, instead, we do something because it makes sense. We know that to become really good, we have to live and breath it. 

CA (short for CannedApps) is proud to announce that we have finally retouched our logo to make it suitable for our philosophy. We feel the outcome is now stronger, more focused and more memorable. Everything that doesn't need to be there has been removed. We love it!

We spent hours digging in color combination books to find the perfect hue for green. Our inspiration incidentally came from "green screens" used in video and animation industry. The web is but a canvas to our imagination. What to wish for in 2010? To make what people want, without giving up. And to never stop learning. Better user experiences for everyone!

Loading mentions Retweet

After postponing it for months, we finally decided we needed a redesign to replace our existing page. We got plenty of good feedback about our look, however, somehow it just seemed like a suit that didn't fit anymore.

So we got rid of bells-and-whistles and started over.

During our first year in business we have learned a lot. We have also come to realize that it takes hard work to design something great. Something that people would like and love to use. Reading more books  and practices about user experience design made us wondering how we could further emphazise people's positive emotions when using web applications. Furthermore, we wanted our own page to be aligned with that philosophy first.

We dedicated whole "Expertise" section to describe what it takes to build better experiences. It's important, because rather than just showing you our work, we find it’s also the way we do things that is important to communicate. End result is important but so is the time between starting and finishing. We treat our clients, partners and friends like we would like to be treated. It doesn't hurt us much to walk the extra mile to keep everybody happy. Never underestimate the power of word-to-mouth advertising, they say.

PS: Talking about good emotions, this post was written using Ommwriter. If you, also,  are a mac guy, check it out.

Loading mentions Retweet