devCodeCamp leans into Scanalytics Heat Mapping Project.
Today kicked off the second collaboration project, following the first successful development between Scanalytics and devCodeCamp last month. During the first collaboration, four devCodeCamp graduates developed an application to simulate the sensor-embedded mats, which are a core component of Scanalytics product. Today, a new team of graduates take on a second project: a heat map visualizer using data collected by Scanalytics’ predictive analytics platform.
The team consists of Luis Diaz (former welder), Alicia Bigley (former graphic designer and photographer), Chris Balleto (former retail manager), and Simon Landis (former soccer league organizer). Each team member brings a unique perspective to the group after completing devCodeCamp’s 12-week fully-immersive software development bootcamp to pivot on their careers.
“It is truly impressive how fast a small team of fresh devCodeCamp grads can jump on a small project, learn new technologies, and roll out a feature-rich product!” – Andrew Llewellyn, lead instructor at devCodeCamp.
After participating in the first project for Scanalytics, Luis has taken the lead on this project. “For the previous Scanalytics project, we used ReactJS and this time around we’re using AngularJS and PHP.” Luis said.
“I think it’s good,” said Alicia. “I’m excited to learn a new language and get back into coding after a week off. Plus, I really like working with these guys.”
The team hopes to bring the second project to fruition on March 23. Check in to our blog every day for updates on Project 2 for Scanalytics…
The first day of the Scanalytics Project Part II brought plenty of excitement from the recently assembled team. Luis, Alicia, Chris, and Simon knew in order to complete their goal of minimal viable product (MVP), they needed to do plenty of research and learn a new technology stack.
That meant the first day of the project was reserved for a crash course on AngularJS, thanks to team lead Luis. The Scanalytics development team also dove into extensive research involving PHP, Chroma.js, as well as, blur.js for blurring. Along with that, they set up their development environments with Node.js and Bower.
Despite the fact there will be a need for constant researching throughout the two-week project, it is safe to say Luis, Alicia, Chris, and Simon are in a great place. More importantly, they are ready to dive head-first into the second day of the project.
The team plans to begin working on building the grid to display the heat map as early as Day 2.
On the second day of the Scanalytics Project Part II, Luis, Alicia, Chris, and Simon went beyond research and began to implement their newly discovered knowledge. With Chris’ dog, Hope, in the room to keep the team company as they dove into unchartered territory, each member of the development team broke off into separate directions to conquer as much as possible in their scheduled amount of time.
Simon began work immediately on building the grid that will be used to display the heatmap. He also teamed with Luis to work in parallel on understanding and using Scanalytics’ source code to try to plug data into the view of the application.
Simon created a grid to allow the application to show different metrics. He also continued to work with Luis on plugging actual data into the application to be displayed on the grid in the view. Alicia continued to work with chroma.js and how to integrate it with AngularJS. It is a process that appears to take up a decent amount of time, but it also seems that it has the potential to have a big payoff on the project. Chris began looking into using AngularJS to dynamically change the CSS (styling) of HTML attributes to achieve the blur of the heat map.
Luis, Alicia, Chris, and Simon feel confident in their progress thus far, especially when considering how much they have needed to learn in the process. It will be interesting to see what will be accomplished as they inch closer to the half-way point of the project.
On Day 4, Luis, Alicia, Chris, and Simon braved the intense snow storm that hit Milwaukee to continue their work on the Scanalytics Project Part II. Even though the less-than-desired road conditions played a role in how much they were ultimately going to be able to get done, the development team did not allow that to prevent them from making progress on the project.
While research continued to be a big part of the development process, Luis, Alicia, Chris, and Simon also managed to restructure the files of the application. Along with that, the team connected and imported all of the necessary AngularJS elements into the HTML (see image below of the heat map). This allowed for the heat map to become more well-rounded. Needless to say, it made the application come to life.
The team also managed to get parts of Chroma.js working, which allowed for color conversions and scaling. This was an important aspect of the application to get working, as the colors need to change based on pressure.
The fifth day of the Scanalytics Project Part II began with a meeting with Scanalytics. The purpose of the meeting was to give Scanalytics a progress update on the project, as well as, to receive any necessary feedback to improve upon the project. To no one’s surprise, Scanalytics enjoyed what they saw of the project so far.
With that said, the specific feedback gave Luis, Alicia, Chris, and Simon some parts to work on. For instance, the blur feature of the application needs to be blurrier, and the button color should turn green when clicked. Along with that, there were various color options to cover, such as what greens, reds, etc. to use in the application.
The rest of the day saw Luis, Alicia, Chris, and Simon working hard to implement the feedback to ensure the project meets Scanalytics’ vision.
On Day 6 of the Scanalytics Project Part II, Luis, Alicia, Chris, and Simon continued to implement the feedback that they received from Scanalytics. They also began to fine tune other parts of the application in an effort to make it as clean as possible.
Part of the fine-tuning process was to begin work on linking the drop-down list with images that change the color of the grid. Essentially, users will have the ability to choose from many different types of color schemes based on their own preference, which will be available in the drop-down list. This allows the ability to eliminate confusion surrounding certain colors having one meaning, and instead allows users to dictate which color combinations mean what. Along with that, it will allow people who are color blind to choose a color scheme that best suits them.
Luis, Alicia, Chris, and Simon ended the day with a meeting to plan what we will be completed over the weekend, as well as, map out what needs to be accomplished each day next week in order to achieve MVP.
Luis, Alicia, Chris, and Simon achieved their minimal viable product for the Scanalytics Project Part II.
As in any project, the team largely spent days seven through nine improving upon what they had built by continuing to implement best practices. This included the addition of images to the dropdown list to dynamically generate the color grid based on a user’s selection, loading a grid based on an API call, and improving the blur functionality.
The development team also did more research on how Scanalytics’ code works. The reason for this was because Luis, Alicia, Chris, and Simon wanted to do the best they possibly could to set Scanalytics up with the necessary information regarding the application. On Day 9 specifically, the team began to write documentation for the application.
Luis, Alicia, Chris, and Simon are looking forward to the handoff meeting with Scanalytics on Day 10 in which they will get to reveal the finished product.
The final day of the Scanalytics Project Part II was a massive success!
Scanalytics very much enjoyed the final product Luis, Alicia, Chris, and Simon delivered. In particular, the company liked the dropdown menu that allows a user to choose his or her own color scheme. In fact, the development team used Chroma.js to give the user the ability to customize countless color scales using hex code. Along with that, the team provided the functionality to change the pixel size of the heat map relative to the size of a given room. Scanalytics also appreciated that Luis, Alicia, Chris, and Simon wrote and provided documentation on the application they built.
Even though meeting Scanalytics’ expectations as far as the application goes is impressive, what may be even more rewarding is how impressed the company was with the production of the devCodeCamp graduates. More specifically, they were amazed at how far the team had come in only 10 days. This involved learning completely new technologies, most notably AngularJS.
As rewarding as building the project was for the group, the experience of building something together spoke volumes.
“I thought the experience was really great because we worked with a graduate who had more experience than us,” Alicia said. “Just to see, given a little time, how much further we can be in our skill set.”
“It was cool that we got to work with a real company,” Chris chimed in. “It showed us that what we learned at devCodeCamp really transitions to real-world projects. Just to see that the fundamentals we learned at devCodeCamp, when implemented in the real world, clearly work.”
Simon’s opinion focused more on the value of learning AngularJS:
“I really valued the challenge of learning a new framework (AngularJS) within a language I knew something about already. Also, I enjoyed working in a team environment with someone who I didn’t know as well as people I am more comfortable with, and just seeing how it is possible for it all to come together through code while being on the same page.”
There is no denying Luis, Alicia, Chris, and Simon have so much to be proud of regarding their awesome achievement.