Tech Tester Mobile

The Mobile Tool that all alarm technicians need.

Tech Used

- React Native
- Android Studio
- XCode
- Framer Motion
- Cloudinary Integration
- Expo
- Lottie
- Adobe Illustrator, XD, & After Effects

What is Tech Tester Mobile?

Built with react native, Tech Tester Mobile was meant to be the mobile tool for alarm technicians on the go. When an alarm technician sets up a new account or needs to troubleshoot an existing one, they have all the tools they need to succeed. Real time account info editing, a live history of all signals that have come in and out of the account, and the ability to put the whole account on test, and to be able to set restore states for each point are just some of the features that went into the application. It is the mobile side of alarmtechtester.com

Of if you didn’t want to hear it from me: Here is how alarmtechtester.com puts the application.

“Our application empowers your team by giving them the tools they need to service your accounts with ease. Our testing utility lets the user easily see what sensors have reported, what has been restored, and what is still unrestored. They can then send a report summary to your office that shows that all sensors have reported and restored before they leave the site.”

So what did I do?

  • I designed the application from the ground up from the use cases provided to me.
  • I provided Adobe XD mockups to my boss (who’s project it was), he provided feedback and we tweaked the design and UX accordingly.
  • Started the React Native Project with Expo. Since the API was not fully done, coded the whole application with mock data as if it was coming from the API. When the API was ready piece by piece, I started integrating it.
  • Created log in/sign up functionality with two-factor authentication through our API.
  • Created account editing features, central station editing feature, time allowed on application feature, team management feature, real time signal scroll, etc.. (I don’t really want to list everything there is in the application, but you get the idea, I did everything.)

Photos

The account view screen in the iOS simulator displaying mock data for security purposes.

Tech Tester Mockups in XD

An early Adobe XD mockup of what the application log in and sign up and home screens would look like. (Spoiler alert! We stuck to the original design.)

Tech Tester Mockups in XD

A few more app screen examples shown in XD. All of these were coded, but sadly the project got put on hold before it could ever be released.

Tech Tester Mockups in XD

The central station configuration screen in the iOS simulator. This screen is where alarm dealers can add and configure their central station right in the app. As long as they log in with the correct credentials, the appp will show them their current permissions with the central station.

Tech Tester Mockups in XD

A chat screen shown here in the iOS simulator.

Tech Tester Mockups in XD

The totality of screens that were coded in React Native. Something like 50 screens total. All done by me!

Tech Tester Mockups in XD

prev
next