DSA Building Performance Ltd.

Screenshots der Website DSA Building Performance auf verschiedenen Bildschirmen

Summary
Dave Stitt, founder of DSA Building Performance Ltd., had found himself in a sort of dilemma: The existing company website did no longer represent his offers and activities and he had no real idea how to go on from there. But Dave wanted the website to be part of his marketing concept as well as a platform for his online activities. The release of his latest book “Deep and Deliberate Delegation” finally was the reason to address the topic.

Background information

Dave Stitt and I got into a conversation during Seth Godin’s Marketing Seminar. Dave is the founder of DSA Building Performance Ltd. He is located in Northern England and has been working as a coach with construction industry executives and teams in over 20 years.

The problem

Dave Stitt had put a lot of work into developing his programs and other offers for his clientele. The publication of his newest book was coming up soon. But the website for DSA Building Performance Ltd. had grown old and did not showcase all the new programs and changes the team had undergone. It felt like a dead end, the website had become a nuisance.

Dave was unsure how to continue from that point, and he did not want to invest a lot of time into the website project without having a clear plan.

Goals

The main goal was to get a new website live before the book would actually be published, which left us about six weeks at that point.

The new website needed to be a platform for DSA Building Performance Ltd. that allowed to showcase both the programs and coaching products as well as Dave’s publications. It should be flexible and easy to work with, in order to easily integrate future changes, new programs and other projects.

Dave had been writing a lot of blog posts over the years and had worked hard to gain a substantial email list for his newsletter. His posts certainly had to find their place in the new website again and needed to be accessible. The email addresses should become the base for a more modern newsletter marketing.

DSA Building Performance

  • New website
  • Page Builder
  • Newsletter via MailChimp

https://dsabuilding.co.uk

Process

Our most urgent task was to develop an attractive solution for the website as fast as possible. There was the old website that, in theory, could have been the base for the new one. Unfortunately there had been new content added while the old stuff had not been removed. It was hard to distinguish what was relevant and what could be discarded.

Therefore we decided to start with a new, clean WordPress install. This also made it a lot easier to take a step back and really start anew. The content we did want to preserve – all the posts and some media – could easily be exported and imported into the new install.

We also decided that we would work in two steps: Get a first version with all the essential content live within four weeks – ready for Christmas – and work on the rest in the beginning of the new year, with a bit more time on our hands.

We met for a kick-off call via Skype and discussed which content we really needed for the first version and what could wait until January.

With these informations, we developed the first prototype, already in WordPress and fully functional. Dave Stitt had access to the prototype and was able to give feedback promptly and to add missing information.

We scheduled a Skype call about once a week in order to keep track of everything and plan the next steps. Due to this close collaboration we knew very well what’s essential for our client and were able to focus on these points. Four weeks after our first Skype call the first version of the website went live, right on time for Christmas.

In the beginning of the new year, we finished some of the not-so-obvious tasks. We also set up a MailChimp account, imported Dave’s email lists and implemented MailChimp on the website. We developed templates for automated newsletters and got everything GDPR-ready.

Conclusion

We always say that the real work with a website only starts when the site goes live. The website we developed for Dave Stitt is a good example for this.

While I am writing this, the website has been live for a little over 1,5 years. Dave has been busy developing his programs, following new ideas, making new connections. The website does not need to be remodeled to feature all the new things. We develop new elements, add, change or remove others. At the same time we make sure that it keeps it’s clear structure, to keep it easy to navigate for visitors.

In order to make it really easy for Dave to change and add content himself, we implemented the page builder plugin BeaverBuilder. It supports frontend editing and is very intuitive to use. Even for clients who only change things occasionally it’s pretty pain-free to work with.

Regular service and maintenance also make sure that WordPress keeps up-to-date and the website is able to grow and flourish with DSA Building Performance for many years to come.

Client feedback

When we first met my workload was down and I felt ashamed to refer people to my old out of date website. Since the launch of my ‘new’ website over a year and a half ago my business has steadily grown stronger and stronger and I feel proud to refer people to it.
It now articulates exactly what my services are and has lots of customer recommendations running through it. My website is one of the key ingredients behind my business growth. And you and Kirsten have handled the whole website creation so it has been easy for me and I am delighted with the result and the impact it is making on my business. Big thanks!

Dave Stitt, Founder of DSA Building Performance Ltd.
Please also check out his LinkedIn recommendation

 


Online Store for all things Origami: Viereck-Verlag

Summary
The small publishing house Viereck-Verlag owns an online shop for all things Origami. But the shop software was outdated and wasn’t maintained any longer. The design and usability did not meet modern standards anymore. It was time for a major overhaul.

Background Information

The Viereck-Verlag publishing house located in Freising (near Munich)  publishes books on Origami and exhibition catalogues. For more than three decades has the publishing house been involved with making Origami better known in Germany. The shop started as a mere side project, in order to be able to offer access to the beautiful papers and books available world-wide.
Today, the shop offers an extensive and well-chosen selection of Origami paper and most beautiful books on Origami.

The shop software was outdated and was not maintained any longer. It was not possible to use a modern version of PHP, which also meant that it was impossible to secure the URL via an SSL certificate. The design did not allow for responsiveness – it was not really fit for the use on tablets or smartphones.

Online-Shop Viereck-Verlag

  • Relaunch
  • WooCommerce Shop
  • Multilingual (German, English)

viereck-verlag.de

Process

After accessing the project, we decided to use WooCommerce and a custom childtheme of Storefront for the new shop website. Storefront is a very basic theme offered by the WooCommerce team. There is no clutter, just the basic functionality necessary for WooCommerce. This allowed for us to develop our custom child-theme on top of Storefront and build a tailor-made shop to showcase all the beautiful products. Using WordPress hooks and filters allows you to customize Storefront’s theme templates fairly well.
On the front page we additionally used the PageBuilder plugin BeaverBuilder. This way the client is able to edit or change all elements on the shop’s home page.

We developed the design in close coordination with the client, using several working prototypes.

The products are rather complex and the shop sends all over the world. We needed to implement different payment gateways and customize shipping options.

  • Invoice according to shop language (German/English)
  • Stock management
  • Customer accounts
  • Discounts for different groups of customers, e.g. discounts on specific products for specific customers or general discounts for certain groups of customers, for instance book stores
  • Different payment options:
    • Instant transfer
    • Paypal
    • Invoice
  • Shipping costs
    • Calculate shipping costs according to weight and destination
    • Print shipping labels directly when editing the order
  • VAT
    • EU-VAT: incorporate the EU VAT-ID if available
    • Reduced and regular VAT for different types of products
    • Selling tax-free for customers outside the EU
  • Newsletter

Testing, testing, testing

When there are so many elements and functions that need to work together it’s crucial to test thoroughly, fix bugs, test again. Especially when it comes to processing payments we needed to ensure that the connection to platforms like PayPal and sofort.com works faultlessly. For PayPal, we did extensive tests using the PayPal sandbox. It also helps to test WooCommerce functionality, e.g. to see whether all the emails are sent correctly and if cancellation and refunding works.

After the Launch

Testing will always be an important part in the life of an online store. Since WordPress core and plugins undergo constant changes, it can always happen that things go wrong. Sometimes, a new version of plugin A is no longer compatible with plugin B. This certainly affects all types of WordPress websites, but most websites are not quite as dependent on everything working smoothely as an online store.
Therefore, we normally test all updates in a staging environment, that is in an exact copy of our website, preferably in the exact same server space. Additionally, we conduct automated daily (or more) backups, an absolute necessity for any online shop.

Conclusion

The Viereck-Verlag online store now features a modern look & feel and is easy to use across all screen sizes. The user interface and the order process are a lot more clear now. Even for our client, the owner of the shop, handling orders has become a lot more comfortable. Many processes can be automated and it is easier now, to keep track of stock levels and sales.

“It’s almost impossible to compare our old website with the new one. The order process for customers now feels like a “normal” online store. For us, it has become easier [… to handle things], even though we need to learn a lot now. The presentation of our products is better now, and we have more options to arrange and change elements on the front page now.”

Silke Schröder, Viereck-Verlag


Gruse Mechanical Engineering

 

Overview
This was a rather special project: The website had been launched, concept and design long done. But the technical base did not work as expected. It needed a technical overhaul, while the look and feel had to stay the same.

Background information

The agency kilometer19 asked us to take a look at the website of their client, Gruse GmbH. The client was upset about the performance of the website.
Looking a bit closer we saw that the client did have a point: It took 11 seconds and more before the website actually appeared.

Google Chrome DevTools; medium DSL speed; two measurements in quick succession

For one page view the website needed to load a lot of files (183 requests) but only some of them were actually needed to display the page. The typical measures like caching and optimizing images didn’t change much. Therefore we proposed to change from the multipurpose theme to a much leaner theme.

Gruse Mechanical Engineering

  • Multisite
  • WPML to MLP
  • Multilingual
  • Removal multipurpose theme

gruse.de

Process

We first created an exact copy of the website in our development environment and installed a new clean theme as well as the page builder plugin BeaverBuilder.

Extracting the content

The website had been built using the theme Avada, one of best-selling multipurpose themes. These themes are not really themes in the WordPress sense of the word, but collections of a theme plus plugins. But as the plugins are tied into this bundle it is not possible to address one of them separately. So it’s impossible to either deactivate functions you don’t need or to really make custom adjustments.

Normally changing the theme should not be a problem with WordPress. But due to the mix of theme and plugins it was pretty much impossible. Avada’s Fusion-Builder takes text and layout information and bundles them up into a complex mesh of shortcodes. This way it is impossible to just reuse the content once you have endeavored to change the theme. This is what it looks like in the WordPress editor:

This is what the front page that had been built using Avada looked like in the WordPress editor after we changed the theme.

Chaos in the database

After that, we deleted the Avada theme in order to work with the new theme and WPML (plugin to build multilingual websites) which the agency held a license for. But it turned out that both the Avada theme as well as the links between the Avada theme and WPML were not deleted entirely.

It is good practice in WordPress that themes and plugins remove all their data from the database once you delete them. Unfortunately there are quite a few developers who don’t follow that rule. Avada left lots of database tables as well as thousands of sets of data in the database.

We tried to delete WPML and reinstall it, but to no avail. Same thing here: WPML did not remove all its data from the database. The problem was that this made it impossible to work with WPML in connection with a new theme.

Meanwhile the performance had improved significantly:

Google Chrome DevTools; medium DSL speed; two measurements in quick succession

Clean Install

We then decided to transfer all content (text and images) into a new WordPress install and to continue with a clean basis. That did take some time, but this way we omitted searching for mistakes and figuring out how to fix these which in our experience would have taken much longer.

Since we had four languages to organize we chose to implement multilingualism via a WordPress multisite install and the plugin MultilingualPress Pro.

Conclusion

The performance of the website has improved drastically. Loading the front page does not even take 2 seconds anymore. Originally it took more than 10 seconds until the page was loaded.

Google Chrome DevTools; medium DSL speed; two measurements in quick succession

We moved the website to our hosting partner Spacehost which provides modern, fast hosting, with the focus on the needs of WordPress websites. With the new theme, there are only 62 file requests when loading the home page, instead of more than 180 from before.

The different language versions are now strictly separated. Each language has now it’s own website with own database tables within a WordPress multisite install. The plugin MultilingualPress takes care of connecting the different content elements with each other. This way the structure is clear and less prone to get muddled up.


Wirtschaftsweiber – A German association of Lesbian Business Women

Summary
“Wirtschaftsweiber” is the only professional networking organization for lesbians in Germany. Rebuilding the website represented the conclusion of a thorough realignment process. Heart of the website is the content members of several regional chapters publish. Therefore, one of the goals was to implement a CMS that is easy to work with, even for inexperienced users. WordPress just seemed to be the obvious choice.

Background information

Wirtschaftsweiber e.V. has been founded in 1998 as a professional networking organization for lesbians in Germany. After about 15 years and many political and societal changes, the association felt the need for an in-depth realignment process. Between 2013 and 2016 Wirtschaftsweiber worked hard on goals, strategies and, last but not least, the way they present themselves in the online as well as the offline world. One of the goals of the new concept is to gain new members and reach out to younger women.
A network can only be successful if it consists of many active members. Above all, one of the jobs of the new website is to encourage women to connect and take part in the various activities of the regional chapters.
WordPress and its build-in blogging functionality offers a perfect base for sharing content.

Wirtschaftsweiber e.V.

  • Relaunch
  • TYPO3 to WP
  • User Generated Content

wirtschaftsweiber.de

Process

First, we needed to develop a concept for the new website with all the goals in mind. We used personas to get a clear idea of the needs of the target audience. With the help of the personas we were able to implement a structure that now allows to really display the plentiful activities. At the same time, it needs to be easy to get all the important information about the chapters and the ways Wirtschaftsweiber is organized. Part of the process was also to declutter the website, that is get rid of content that at some time or other had felt relevant.

Once we had identified the structure we needed to develop a design concept for the website. Since Wirtschaftsweiber had also gotten a new logo and aquired a new, more lively color concept, we used these elements as base for the new design.
We developed a modular system of reusable panels to allow even inexperienced users to create new pages quickly. The panels can be arranged as needed.

In the end, we implemented the design in a custom WordPress theme.
The most important factor for us was to implement things in a way that makes it as easy as possible to create new content or edit the existing content. The editors are a very diverse group, with some women being familiar with WordPress and others who have never had any experience with publishing content online.
In order to enable networking directly on the website, we created a private section with profiles and information exclusively for members.
We also worked closely with several members to test the usability and the overall structure and appearance.

Conclusion

The website now appears up-to-date, both visually and technically. For both, visitors as well as editors, it has become a lot easier to use and we are happy to see a lot more activity today than with the former website.
Wirtschaftsweiber are now able to reach out to a broader public, gain new members and even create interest among younger lesbians.


Heintges Architects, NY

Summary
The architecture company Heintges had picked Elmastudio’s UBUD theme for the relaunch of their website. The most important task of the website is to showcase Heintges’ impressive construction projects.
In order to allow for UBUD to support that kind of showcase, we needed to extend the theme’s functionality. We added a few page templates as well as an elaborate filter function for the construction projects and took care of the transfer of the projects to the new website.

Background information

Heintges Consulting Architects & Engineers P.C. is an award-winning professional firm offering the highest level of expertise in the design and implementation of the building envelope.”

Heintges is a firm specialised on curtain wall and exterior cladding for building projects within the US but also in more than 24 countries worldwide. Heintges has designed and consulted on some of the most prestigious cultural projects in New York City, including the renovation of the United Nations Headquarters, the new Whitney Museum of American Art, Lincoln Center, and the Museum of Modern Art.

The client had been working on the UBUD theme single-handedly. As soon as you start to adjust templates, you also need to adjust the style sheets accordingly, otherwise you won’t be able to maintain responsiveness, that is that your website is looking good and can be used on all screen sizes. If you want to use an existing theme, maintain the theme’s look and feel and at the same time add to the theme’s functionality, you need to have deep knowledge of both the theme itself but also of frontend development, especially CSS.
Since we have been huge fans of elmastudio themes and have worked well with many of them, we were able to assist Heintges at this point.

Our task was to adjust and extend the UBUD theme in such a way that adding and maintaining projects would be easy. We worked closely with the Heintges team and tested usability on the go. Additionally, visitors were supposed to be able to sort the projects in manifold ways.

Heintges Architects

  • Relaunch
  • Filtered Portfolio
  • Custom Post Types

heintges.com

Process

In close cooperation, we first developed a concept to help distinguish between projects. Especially interesting projects that are presented using impressive photography needed to be kept separate from the regular projects, which come with few if any images.
We defined the two project types as different so-called “post types”. This way, an editor knows easily where to add new projects. This also helps to easily follow through with the different way to present both project types. For you as a visitor it’s clear at first glance which projects offer more information, e.g. images, and which don’t.

Prospective clients have the option to filter the projects according to different criteria: location (city, country, continent), and building type. This way it is easy to find projects that might resemble what they are looking for.

The first step was to export content from the former, static website and add it to our new WordPress install. Project data was only available as spreadsheets. Therefore we needed to do a CSV import, seperated for the two different project types. To make sure everything went well the Heintges team went through all the data once more and adjusted projects if necessary.

Most of the communication took place via Trello, plus occasional conference calls.

Conclusion

Heintges Building Envelope & Curtain Wall Consultants now have a website that showcases their projects beautifully. All major projects feature beautiful photographs. These images create an impressive visual appearance with the help of UBUD’s portfolio view.

Another important task was to keep usability as simple and as robust as possible. It is now easy to create and maintain the projects, so that the Heintges team can keep the projects up-to-date.

Backups, updates and maintenance are covered by a service agreement.


Franciscan Province of Germany

Summary
The Franciscan Province of Germany wanted a more modern look and feel for its website. The former website was not responsive, that is it was almost impossible to view on mobile devices. Looking at the content of the website, it also turned out that blog posts on current topics could barely be found by visitors.
We developed a content strategy and built the WordPress base accordingly. Current topics now take centre stage, the website has become a modern and lively communication hub.

Background information

The Franciscan Province of Germany consists of 350 members and 35 branches of the Franciscan Order in Germany. There are friaries and convents as well as educational institutions and social services. Like for many fraternities, it is difficult for the Franciscans to attract young people. This is one of the more important reasons to focus on developing the new website as a communication hub with a broader public.

The structure of the former website was basically built for static content. At the same time, quite a few editors wrote a lot of interesting content called “News”. Unfortunately there was no prominent place to display these articles, they ended up in sidebars and rather soon were hidden from view in an archive.

Franciscan Province of Germany

  • Relaunch
  • TYPO3 to WP
  • User Generated Content

www.franziskaner.net

Process

The first step was an initial workshop with the Franciscan Province’s media team to figure out what the main goal of this new website should be: Unostentatiously getting into a conversation with people, especially with people who are not deeply ingrained within the (catholic) faith.

This lead to the question: Who are these people?
We identified different groups of people, for instance people who are searching for a spiritual home, people who might not have a close relationship with Catholicism or church in general.
Another vital group are people who want to help others, either by volunteering or by donating money. They are looking for projects they believe are trustworthy.
And last but not least, men who are interested in joining the fraternity for whom the website should provide a low level option to get in touch.

Design

Our colleague Katja Schwarz developed a clear and welcoming look and feel. The design manages to connect tradition and modernity in its elegant visual appearance. The website appears open and modern but does so without trendy effects and gimmicks.

Design:Katja Schwarz

Content

One of the most important goals of developing the website anew was to showcase all the articles on contemporary issues.
With WordPress this can be easily done: WordPress distinguishes between static content and posts. WordPress’ build-in blog functionality is a powerful means to process and present that kind of content.

Part of the relaunch process was to make the decision which content elements should be transfered from the former website to the new one. It would not have made sense to transfer all the content, especially since the structure and the focus of the new website are rather different from the former one.
We therefore made an extensive content audit: we recorded all content elements of the former website, and, with much assistance of the Franciscan web team, assessed what was there. We transfered very important content, other content elements were edited, a rather big share did not make it into the new website.

All of the insights and results we gained from our conceptual work lead to the custom WordPress theme we finally developed for the Franciscan Province of Germany.

Conclusion

The new WordPress website provides a robust, up-to-date base for the work with todays’ world’s questions. Adding and managing content has become a lot easier and faster.
Today, this permanently growing content base is the heart and soul of the Franciscans’ website. Visitors feel more welcome, the website invites to start an open and lively dialogue.