PROJECT: The Mira-Tab

The Mira-Tab, a Google Chrome Extension that takes the best parts of Momentum and uses internal Mirasee assets.

Table of Contents

Introduction

Mirasee wanted a way to boost inter-team communication by providing a way for team members to learn more about each other. A tool to improve culture.

The result: The Mira-tab!

This Google Chrome extension replaces the default New Tab feature within Google Chrome. It then displays a beautiful splash screen with the user’s current time (and the time at the Mirasee offices), a beautiful photo from the Mirasee archives, and some random trivia about someone on the team.

Features

  • Background: It pulls a random image from the Mirasee library of photos from prior live events, like LIFT 2017-2019, Mirasee retreats and ACES Masterminds. The Lower-Left corner provides additional background information about the photo.
  • Middle: It shows the current system time for the user, using Moment.js library.
  • Top-left: Mirasee logo and Weather (Not finished: Weather wasn’t working accurately. My goal was to pull the user’s geo-locations and generate weather using the OpenWeather API.)
  • Top-right: Context-sensitive links based on the user’s role in the company. (Not implemented)
  • Lower-Middle: Random trivia that the staff member shared.

Built With

  • Written with pure JS
  • Bootstrap 3
  • Moment.js library

Explanation

  • Images were located in a custom /image/ folder not included in the repo. Images were put in an array, and randomly selected.
  • Trivia was placed in a 2d array, and was also randomly selected with the user’s image and trivia content.
  • The CSS placed a blue filter on the photo and provided the animations.
  • Bootstrap made it responsive.

Acknowledgements

Shout out to the Mirasee team for helping with identifying the best pictures, and Rebekah Chalkey for assembling trivia facts from the weekly “Did you Know” emails.

Additional

REPO: https://github.com/RockyKev/mira-tab

Leave a Comment