This month, we have launched a project we take special pride in.
Archello is a global platform for designers and architects. It makes it easier to search and connect with manufacturers of various products and encourages communication among design professionals.
We started collaborating with Martijn Postmus – CEO of Archello – in 2013. Back in the day, Archello was a global platform that united 90K architect projects, 50K companies, and 100K subscribers.
The Archello project idea came after listing to our users, what drove them, what could we improve and how could we better help our target users faster and better communicate.
This led, after almost 2 years for designing and working together with our users to a completely new redesign and new tools for the architecture and design community.
The new Archello is revolutionary and we have a lot more tool coming up.
– Martijn Postmus
What you will learn:
About Archello
Archello is a fascinating place to explore, even for those not particularly into design and architecture!
The website showcases brands, projects, products, and events. All sections are connected and create a great experience for a continuous discovery of new architecture styles, products, projects, and brands.
Brands are filtered by type: designers, architects, manufacturers, contractors, floor and stair manufacturers, consultants, developers, and so on.
Brand page
Every brand has its individual page that features vital information about the brand like brand description, team, and contact details.
Dedicated tabs showcase the brand’s products and projects. If the products are used by other companies listed on Archello, there are links to their pages, too.
On this page, the brand may include the team members who have accounts with Archello and provide their office contact details.
Further on the page, all brand projects are displayed on the map, and the user can click the location to see what project has been done in that specific area.
Project page
Project page allows you to share the concept and vision, highlight the most outstanding features, and tell the story of the creation process.
Besides, the project page lists the manufacturers who have been involved in the project and the products used to bring it to life.
Product page
On the product page, the manufacturer displays a photo gallery with use cases. There is an option to contact the manufacturer and ask a question, request a price, documentation, or supplier list.
The product page has product specifications and a list of other products offered by the same manufacturer.
Project guide
You can choose to browse the brands and discover their projects through the brand pages or use a Project Guide tool in the upper navigation.
It has filters by project types which can be narrowed down further by location, industry, project status, and author.
Product selector
Just like with projects, users can browse products using the Product Selector tool in the main navigation.
Product catalogue has many categories and nested subcategories, so it’s a real journey through the variety of ideas and concepts – don’t get lost 🙂
Events
Finally, there are events that can be filtered by country and date.
And now it’s time to get technical and dive into the development details, which there are quite a few.
The challenge
A long time ago in a galaxy far far away Archello was built with Drupal 6. Back in the day, Drupal was a good solution and served its purpose well.
However, after its end of life announcement was made, together with Martijn we decided to move away from Drupal altogether and build a shiny new website with the Yii 2 PHP framework.
Drupal modules contain a lot of unnecessary functionality that slows down the core and make the website load much longer. Besides, extending the system to add new features takes much more time and effort than with Yii, and at times, specific components are impossible to implement with Drupal.
The solution
So, we rebuilt it all.
Our Yii2 developer, Alex Kokorev, was faced with one of the most exciting, yet challenging, tasks – build a new project architecture that ensured flexibility, expandability, and high system performance.
While our frontend developer, Ruslan Arshinnik, nailed the sleek look and feel of Archello by using the most suitable JavaScript libraries.
To import the content from Drupal to Yii, we created a custom console command. Overall, we’ve migrated a 1Gb database and 600Gb of files to the Amazon S3 server.
Server
The new Archello runs with Amazon S3 and uses Amazon Lambda, a serverless computing system that provides continuous scaling and lets you save on server management.
Images
Image performance is enhanced with Imgix. It’s an image processing CDN that serves optimised images quickly to any device. Archello is loaded with tons of images, so Imgix has a significant role in website speed and performance.
Social login
Allowing users to log in with Facebook, Twitter or Linkedin other social network is a matter of courtesy these days, improves conversion and merely is user-friendly – and Archello has this too.
Other third-party integrations
- SendGrid for email marketing and management.
- Google API for Google Maps, Place Autocomplete, ReCaptcha etc.).
- Video API (Youtube and Vimeo).
- GeoIP2 with MaxMind.
Frontend features
New Archello is very visually appealing.
Scrolling is accompanied by an easy and smooth slide-up and fade-in animations.
Galleries on the homepage and in the guides have zoom out and fade-in effects. Mobile users can enjoy light animations, while the grid to slider transformation has a nice 3D overflow effect on mobile and tablet.
On a Final Note
We’re delighted with the result!
And “we” means a great team that worked together and drove things forward: one frontend developer and one backend developer who worked full-time, and one project manager and a system administrator who worked part-time.
The new Archello is an art object itself, and we love every page, every small icon, and every pixel.
But this is not the end – Martijn plans to develop the platform further, and we’re excited to see how it will evolve.
The future Archello will have some amazing new functionalities we are designing now. As we always say, a website is never fully finished, always thinking of the next new thing our users can benefit from.
If you’re inspired by Archello and would like to build a great web platform of your own, drop us a line – let’s talk about it and do it!