Today marks my one year anniversary at Dialexa! Coincidentally, I’m also rolling off of my third application built while at Dialexa and my third with my biggest client, JLL (Jones Lang LaSalle).
I’ve worked with an awesome team here over the last 10 months on an app called “JLL My Client Briefcase” or “Briefcase” for short. Its purpose is to allow a real estate broker to put together a list of properties and suites in office buildings or industrial buildings to then present to a client looking for rental space based on a long list of requirements and desires. In less than a year, our small team has built a beautiful app complete with an admin portal, broker portal, and separate client portal that a client can log into in order to give feedback on the properties a broker is presenting to them, and they can communicate through the app to narrow down the client’s options until they find the perfect space to rent.
I’m really proud of the work I did on this application and I wanted to share just a few screenshots of the app with you! It’s fully responsive for use on mobile, tablet and desktop, and is secure behind JLL’s single sign on system for the broker portal, and our own login system for the client portal (I wish I could share a live demo with you, but this isn’t available for public use yet).
Technologies tools, and methodologies used in the development of this application include: Agile Software Development, .NET WEB API 2, Angular 2, SASS/CSS, Typescript, HTML, Javascript, npm, git source control, Team Foundation Server (TFS), Visual Studio, VS Code, MS SQL Server, and Slack (mostly for posting funny .gifs to make our team laugh).
This is the broker portal’s dashboard – the first thing you see when you log in as a broker with JLL’s Briefcase.
This is the broker’s dashboard in a responsive tablet view. It shrinks down to a single column for viewing on mobile phones.
Sample list of all of the ‘Briefcases’ (a set of properties and offers for a client) that the current logged in broker has access to.
Now we’re getting to the big deal. This is the main view you get of a “Briefcase.” You can see all properties in the briefcase on the map, and scroll down to see properties and spaces in those properties on the left. This page and its tabs are full of information for the broker and client to use to reach the perfect space for the client’s needs.
Example modal for adding brokers to your team so they can contribute to work done on the briefcase and work with clients alongside the primary broker.
This is the list of brokers on a briefcase. You can reorder the list, hide brokers from the client (for admin purposes), set a main broker, and remove brokers here.
Think of a “Tour Book” as a packet of information and pictures related to the properties you as a client would go look at in-person with your broker. These used to be created by hand by brokers, and now it’s automatically generated with the click of a button according to your preferences saved for your briefcase.
This is the view of some property details you can see by clicking on any property in the app. Below these details are listed all available spaces in that property (if there are multiple suites or rooms available).
Slide-out menu with site navigation and legal info
App dashboard when logged into the client portal
Listings view on a briefcase from the Client Portal
This comment feature allows brokers and clients to communicate directly on each briefcase whenever they want.
Related
