register

BROK

One-Stop Shop for Land & Real Estate Services

Brok is a web app that makes buying and selling real property transparent and easy. Users can get data from registers, order certificates and surveying services, post and find ads simply by clicking on the map. The app already brings our client over 30K targeted visitors per year.

Goals

  1. To engage the target audience with free tools: interactive cadastral map and classified ads.
  2. To make ordering land surveys fast and easy.
  3. To build a single online platform that enables users to buy and sell property and order any related services.

Functional requirements

  • Interactive map shows plots from cadastre, land auctions, and real estate ads
  • Customers can use a traditional catalog with filters and sorting
  • When users place ads, the system instantly retrieves data from registers
  • To see cadastral data, users can click on the land plot
  • You can order references and services for the plot you’re interested in right away
  • Users can pay and set up shipment details on the website

Process

Tech specs

The client came to us with a well-thought-out idea. Having a solid experience in his field (land surveying) allowed him to build a clear vision of what his new product should do. We just had to summarize project goals and break them down into technical subtasks.

 

Team

Project manager (PM), backend developer, frontend developer, QA engineer, UX/UI designer.

At the beginning, we worked on building a map closely with our client’s expert.

 

Website structure

PM designed a website structure based on project goals and competitive research. We decided to leave 4 main sections: homepage with a map, classified ads, services, and user account.

We also add some pages required for integration with third-party services. For instance, to connect LiqPay, a payment system, you should have a dedicated ‘payment and delivery’ page.

The structure map served as a starting point for designing the UI.

Prototype

We designed the UI to make the key features easy to use. We placed main navigational links and CTA buttons in the header. Links to low-priority pages resided in the footer.

The key feature is the interactive map. We placed it in the center of the homepage. You can zoom the map in to see the plot in any part of the country.

When working on the prototype, we actively discussed the details with the client. We approved most of the elements from the first try. At that time, we’ve already launched 100+ projects and knew how to make a good UI. Although with some elements, we had to go through a couple of options.

For example, we wanted to make map markers as icons of different shapes, depending on the property type. But the icons would overlap on the map when users zoom out. Also the client would’ve to hire designers each time he adds new categories. So we decided to differentiate markers with color instead.

While working on a prototype, we were adding details into specs. And the document grew up from 15 to 50 pages.

In our experience, it’s better to spend time on extensive specifications than leave room for ambiguity. Investing in a good spec always pays off.

Coding

We built this website from the ground up because there were no ready-made solutions to achieve project goals.

We used our own modules for email newsletters and an SEO, adjusting them for this project. Our devs wrote frontend on Vue.js. They took Multiselect from libraries, everything else they code from scratch. For layout, we used pure CSS3 with pre-processors but without Bootstrap.

Challenges

When integrating with the online court database, we encountered problems obtaining data on real estate court cases.

We explained the situation to our client. And he guessed what the cause was right away. It turned out that there were changes in case name formatting in the new court database.

We fixed the code, and the sync started to run properly.

Results

We’ve carried out integration with the land registry, OpenStreetMap, and Google Maps.

To check the cadastral number, intended use, type of ownership, and area of any land plot — just click on the map. To get more detailed information, you can order paid certificates and services right from the pop-up.

Map tools

  • Ad filter
  • Search by address and cadastral number
  • Distance measurement
  • User location
  • Print
  • Scaling
  • Toggling the boundary layer on/off
  • Tooltips

Ads

Users can add and search for ads on the website.

When you publish an ad, the set of input fields changes for each category. But you don’t have to fill in all of those fields manually. Simply enter the cadastral number, and the data from registers will load into the required fields automatically.

Communication

There is support and social chats.

Users can talk to each other (about ads) and to admins (about order statuses). They can attach photos, screenshots, or any other files to their messages.

The system automatically notifies users when the status of their orders changes. They get a message in website chat and on the email.

User accounts

Visitors can sign up with email, Google, or Facebook. To ensure that users’ data is safe, we carry out this feature using secure protocol oauth2.

Sections

  • Order history
  • Inquiries
  • Ad management
  • Notifications
  • Settings

Marchenko Sergey

CEO at Brok

User account functionality makes it easy to keep track of the number and types of orders. Users place all the orders without our involvement. And we try our best to move away from telephone consultations and negotiations. Also, personal accounts allow users to monitor order fulfillment and payment statuses, as well as download the generated documents. Now, we process multiple orders at once with one website admin (with phone calls, of course, it wasn’t possible), and then fulfill them in batches…

User account functionality makes it easy to keep track of the number and types of orders. Users place all the orders without our involvement. And we try our best to move away from telephone consultations and negotiations. Also, personal accounts allow users to monitor order fulfillment and payment statuses, as well as download the generated documents. Now, we process multiple orders at once with one website admin (with phone calls, of course, it wasn’t possible), and then fulfill them in batches…

Mobile version

The website has a responsive, mobile-friendly layout. UI adapts to the size of the screen. This web app is easy to use on desktop, tablet, and mobile.

Brok 2.0

Our client asked to implement only the core features and launch the project ASAP. But during the development stage, we came up with several ideas to expand the capabilities of the service.

So after launching the first version of the product, we proposed to add a few features:

  • Blog-like section to promote the website with useful content
  • Monetization module with paid options
  • Other minor improvements

The client approved our suggestions, and we scheduled the upgrade for March 2020.

Information about the project

Project type Interactive catalog and inquiry service
Industry Real property / Real estate
Time frame March 2019 – April 2019
Tech stack JavaScript / Vue.js, Python / Django
Watch the website

Thank you for your interest!

We will contact you soon