Makings of iSpect
Note from 2024
Quite a lot has happened over the years in the journey of ispect, and as such I will be treating this post more as an archive than a case study.
My role started out very innocently back in 2012 with designing the brand and the UI in Photoshop (with custom scripts to export the assets to xcode!). Thank Goodness Sketch came out... But, I quickly became quite disatisfied with the implementation of said UI's and started my journey into xcode frontend work (Meng To came in clutch and provided designcode.io which helped me a ton).
Over time we put the iOS app on maintenance to work on icontrol so my work shifted as well, and my focus became more and more on web development. CSS, React, Vue, Vuetify.
Hitting 2020, we got the opportunity to scale ispect - it seemed the market was ready for something bigger. We made what was only an app for inspections into a fully fledged project management and order flow web app for construction and inspections with the ambitions to release it nation wide.
I was thrown head first into web development and it set the foundations for what I know, and how I work today. Rapid iterations & complete ownership.
However, as we all experienced, covid happened and we had to put a complete stop to everything in 2021. Since then it has been a grind to keep everything running, and hence I will be presenting some older, newer and yet to be released work from over the years below.
Make informed decisions during procurement with real time data
iSpect landing page (2023 edition)
Nominated for Innovation of the year 2013 (Article in Swedish)
ispect dashboard and landing page from 2020
ispect closeout (2020), aimed at the subcontractors to see their assigned issues and remedy them.
Why?
iSpect is built to provide transparency in the construction industry in many ways, through data and statistics mainly, but also to provide clear communication routes between contractors, sub-contractors and stakeholders.
How?
With over a decade worth of statistics from the construction industry we have built a web platform which allows contractors and sub-contractors an easy way to see the health of their project.
They get to see how many issues has happened throughout the project as well as the average time it takes to complete it, in real time.
This allows contractors to see which sub-contractors are performing well or subpar - saving time when negotiating for contracts.
Features
A completed project based in Stockholm showcasing total project issues
Quickly overview which areas that lack the most
Deep dive into categories (titles in Swedish)
Showcasing the average time it takes to remedy issues per sub-contractor. Including how long it took to report their self regulations.
Branding
Brand was initially built back in 2012 and has since evolved many times over to finally land in what you see below with a very minimal logo that incorporates our classic search icon in the logotype.
As iSpect grew not only as a product but as a company it represented more than just the app, but also the people behind it and as such I found it needed to be scalable and applicable to many surfaces.
Finalized logotype incorporating the Search icon that's been used from the very start 10 years ago.
iSpect for hard hats (usually not allowed to change the color)
Refactoring of ispect 2023
Here I'll be highlighting some app views from my work in refactoring the app from vue 2 / vuetify 2 to vue 2.7 (plan was vue 3, but with time constraints it was put on hold) and tailwindcss. In the interest of time and given the complexity of the app I chose to keep Vuetify (the table being a key component across the app, especially), but completely strip all of its css, effectively making it headless.
My aim was simply to modernize the design, make the UI streamlined and less janky (personally find the vuetify google theme a complete abomination, but also doesn't scale well.). Long term vision was to make the app more performant, and show a lot less info to the user - making the experience more "auto-magically".
Do note that there's pleeenty of pages and features in the app, but they're generally speaking (visually) similar so I've tried to distill it down some main features for your viewing pleasure:
The ispect landing page was redesigned at the same time and can be viewed live: iSpect landing page