From Freelance to Fulltime and Back Again

2024-12-15
Glossi company logo

The Opportunity at Glossi

I had been looking for a great job opportunity for a while now. While working on my own projects had been fun, I really missed collaborating with others.

A former coworker reached out about a project she needed help with. The tools they used were very similar to what I already knew, so it seemed like the perfect fit! Of course, I accepted right away when she asked me to join her team.

The focus of the contract was on implementing the v2 design. For the most part, this was just a facelift. There were plenty of instances where new components or functionality had to be added, but I was generally starting off with a solid foundation.

The app

Glossi allows users to get perfect shots of 3d models. The app uses Unreal's Pixel Streaming to allow users to control a virtual camera in a 3d environment.

You can also customize the lighting, backdrop, and various other settings to make your scene look exactly how you envision it. Adjust the brightness, color temperature, and intensity of the lights to set the perfect mood.

Choose from a wide range of backgrounds and backdrops. Fine-tune every detail until your creation looks as incredible as you’ve always imagined it could be.

v1 studio export page
v1 export
v2 studio export page
Updated export

Getting Started

Onboarding was quick and painless. Here are the parts of the stack that mattered to me:

The app was already using a bunch of familiar tools with the exception of Pixel Streaming (which wasn't necessary to get started). After a tour of the app I was able to jump straight into the work.

The Process

After a couple of days, I had found a rhythm. After a couple of weeks, the process was clear enough to outline.

v2 studio change backdrop
Change the backdrop
v2 studio add new shot
Add a new focus

This was my order of operations when I did not have a list of requests to go by:

Scouting

  1. Look at the design in Figma to see what needs to be done
  2. Look at the website to check for current implementations
  3. Look at the code to see if anything was scaffolded

Actual Work

  1. Modify code or create new components, making everything as standard and reusable as possible
  2. Test the changes to ensure they work as expected
  3. Find other areas where the same change (or similar) can be applied

Publishing

  1. Push the changes to the repo
  2. Create a pull request
  3. Wait for the pull request to be approved and merged

Repeat

  1. Take a break before repeating the process

The Lessons

Much was learned during this process, but here are the biggest takeaways.

  • Fonts, colors, and text should be implemented first
  • When in doubt, always get a second opinion on the design
  • Feel free to ask questions like "Can I include this NPM package?" or "Can I change the way that this is done?".
  • Make decisions that improve the user experience when necessary. Bring these up with the team before pushing changes.
  • Enforced commit message quality is good. It encourages smaller commits.
  • Merge conflicts happen a LOT when multiple developers are aware of (and capable of fixing) the same issue. Communicate with the team!
  • It's just as important to organize Tailwind styles as it is to organize React components.
  • I have a long way to go before I fully understand grid and flexbox
  • React's performance profiler isn't completely useless, but it IS a pain to use.

What's Next?

More frontend work? Yes, please! My time with React and Tailwind paid off in an unexpected way. Now, I'm wondering how to keep this up.

Everything is a learning opportunity, but this one was one of my best yet. My frontend skill level is higher than I thought it was. There's still a lot of room for improvement, so I'm excited to keep learning.

I'm also grinding away at the Udacity Ethical Hacker challenge. Finally getting around to upping my Linux game.

Future Learning Plan

Studying the following things will help me become a better frontend developer.

Paid courses