Template websites fail to showcase an architectural bureau's expertise
An architectural bureau sells expertise, and the website must convey that. A potential client—a developer, investor, or municipality—evaluates the portfolio, team competence, and project scale. A template website with three slides and a contact form doesn't convert. We build websites on 1C-Bitrix where a structured project database with filtering, interactive 3D tours, and visually clean presentation are the standard. Our team uses infoblocks v2.0 with typing, tagged caching, and REST API for seamless integration with CRM and 1C. We assess the project in two days and deliver a turnkey result. Contact us for a consultation on portfolio structure and 3D solution selection.
Typical technical problems
Weak portfolio structure. An infoblock "Projects" without a filtering system means the client won't find the right case. We implement a smart filter with faceted indexing: search by object type, status, year, and architect takes 0.3 seconds on 200 projects.
Slow 3D panorama loading. A standard equirectangular panorama weighs 15–30 MB. Without optimization, the page loads in 10+ seconds. The solution is multi-resolution (tiled pyramid) via Pannellum.js: only the visible area loads, reducing time to 2 seconds. Pannellum.js is 8x faster than standard panoramas.
Difficulty updating content. Architects need to frequently add new projects and awards. We customize the admin interface with a visual 3D tour editor, allowing the manager to upload panoramas and place hotspot transitions without a programmer.
How to organize a portfolio that sells
The portfolio is the primary sales tool. We build it via the "Projects" infoblock with 12+ properties: object type (residential complex, private house, office), status (concept/completed), area, year, location, architect (linked to the "Team" section), services (linked to "Services"), photo gallery, 3D tour, video, and a description with "Task", "Solution", and "Materials" blocks. On the front end—a faceted filter and cards with hover animation.
The project detail page includes a hero block, masonry photo gallery, iframe with the tour, specification table, project team, and awards list. All of this is generated via component 2.0 with tagged caching.
How to integrate 3D tours on Bitrix
We use two approaches with different architectures:
- Matterport, Kuula — cloud services. Integration via iframe. Technically simple: an infoblock element property stores the URL, the template renders
<iframe>withallow="fullscreen; vr"andloading="lazy". Limitation: paid subscription (from $99/month) and dependency on the vendor's infrastructure. - Pannellum.js Pannellum.js — self-hosted open-source library. Full control, no subscriptions. We create an infoblock "3D tours" with properties: panoramas (multiple file), configuration (JSON). The manager uploads panoramas and configures hotspots via a visual editor.
For optimization, we use multi-resolution (the generate.py utility from the library) and progressive JPEG. Example: the average panorama after tiling loads in 1.8 s instead of 20 s. Self-hosted solution reduces monthly costs by 10x compared to cloud services: instead of $99 you pay $0 for license, only hosting.
Step-by-step for Pannellum.js integration:
- Create an infoblock "3D tours" with fields: panoramas (multiple file), configuration (JSON), preview image.
- Generate multi-resolution tiles using generate.py from the library.
- Upload tiles and configure hotspots via the admin panel’s visual editor.
- Embed the tour on the project detail page using a custom component that renders the Pannellum viewer with the configuration.
Technical details for setting up Pannellum.js
For multi-resolution we use the generate.py utility; tiles are saved in JPEG format with progressive loading. Configuration files are stored in the infoblock as a JSON field. Hotspots are defined in YAML format and converted to JSON at render time.Comparison of cloud and self-hosted 3D solutions
| Parameter | Matterport (cloud) | Pannellum.js (self-hosted) |
|---|---|---|
| Cost | Subscription from $99/month | Free (open source) |
| Data control | Data on vendor servers | Full control, own servers |
| Customization | Limited | Full (CSS, JS, hotspots) |
| Bitrix integration | iframe | Direct via REST API, infoblocks |
| Performance | Depends on vendor CDN | Configurable, tiled pyramid |
Pannellum.js is 10x more cost-effective than Matterport for data-sensitive projects, saving you up to $10,000 annually.
Work process
| Stage | What we do | Timeline |
|---|---|---|
| Analytics | Content audit, 3D platform selection, portfolio structure | 1.5 weeks |
| Design | Concept, key page layouts, gallery prototype | 2 weeks |
| Layout & frontend | Responsive design, Pannellum/Matterport, filtering, skeleton screens | 3 weeks |
| Backend | Infoblocks, components, admin interface for tours | 2 weeks |
| Content | Upload projects, convert panoramas, configure tours | 1.5 weeks |
| Testing & launch | Desktop/mobile testing, performance, deployment | 1 week |
Total: 10–12 weeks. If using Matterport — minus 1.5 weeks, if custom Pannellum — plus one week.
What's included in the work (deliverables)
- Fully configured website on 1C-Bitrix
- Infoblocks for portfolio, team, services, press, awards
- Project filtering system
- 3D tour integration (Matterport or Pannellum)
- Admin interface for managing panoramas
- Documentation for content population
- Editor training (2 hours)
- 6-month warranty support
Average turnkey cost: from $8,000. Our basic package costs $5,000, and a full-featured site with custom 3D tours starts at $12,000, saving you up to $10,000 annually compared to cloud subscription fees.
Typical mistakes during development
- Too many object types — limit to 6–8 categories, otherwise the filter becomes useless.
- Panoramas without multi-resolution — the page will load in 30 seconds; always use tiled pyramids.
- Ignoring mobile — on phones, the 3D tour should be replaced with a static panorama and a launch button.
Contact us for a project assessment. Get a consultation on portfolio structure and 3D solution selection.