What Architectural Masterpieces Can Teach Us About Front End Development

“We build for the user, which necessitates we do our research,” states Franciele, a Front End Engineer with OLX Car Parts.

Unlocking tech talent stories

April 22, 2021
Franciele, Front End Engineer at OLX Motors facing the camera, smiling

“We build for the user, which necessitates we do our research,” states Franciele, a Front End Engineer with OLX Car Parts.

“One fascinating user group I’ve learned more about are Collectors. Collectors are vintage car owners. They use the OLX platform to find specific car parts for their vehicles. I’m happy our platform can help them locate these rare parts.”

That’s just part of what makes work as a Front End Engineer for Franciele, who actually began her career as an architect. Now at OLX Group, the world’s fastest-growing network of trading platforms, Franciele uses her unique skill set to help OLX Group shape the future of trade.

During our talk with Franciele, we learned a lot about front end development. Intriguingly, Franciele highlighted a connection between architectural masterpieces and front end development. We found that connection fascinating. So, in this post, we’ll discuss what architectural masterpieces can teach us about front end development.

Black and white picture from a house called Casa das Canoas

Casa das Canoas — Oscar Niemeyer

Lesson = STAND OUT

Oscar Niemeyer played a big role in developing modern architecture, and Casa das Canoas stands as one of his residential masterpieces.

“As a Brazilian who’s studied architecture, any conversation about architecture must include Oscar Niemeyer. His works, especially Casa das Canoas, inspire me as a front end developer at OLX,” says Franciele.

Casa das Canoas inspires because the home stands out while elevating the surroundings. As an article in ArchDaily states about the home, “The house is inserted and stands out in the landscape, while nature is emphasized by it.”

“The house is inserted and stands out in the landscape, while nature is emphasized by it.”

OLX Group is part of Prosus (and Naspers) and owns products and platforms that serve over 300 million people every month across the globe. Its Lisbon hub is home for the Motors vertical, where the teams create Europe’s leading destinations for buying and selling new and second-hand cars, car parts, motorcycles, and much more.

When Franciele thinks of the OLX networks, with its horizontal platforms (general classifieds) and vertical platforms (real estate, motors, etc), she imagines Casa das Canoas. She wants each individual platform to stand out on its own, yet also align with the rest of OLX’s network.

“I think of Car Parts as a horizontal inside the vertical. Car Parts does align with the Motors platform, but we’ve taken steps to make it stand out. This way, we can specifically fulfill the needs of users.”

Some of the unique attributes you’ll find on the OLX Car Parts platform include:

  • A more prominent search bar: As Franciele describes, “the user journey for car parts differs a lot from cars. While vehicle shoppers may wish to click a few filters and scroll through the listings instead of search, car parts customers have a specific part they need for a specific car model. They have a reference number and use the search bar to directly find that part.”

User journey - Car

“The user journey for car parts differs a lot from cars”

  • Faster data queries: Franciele and the team added a data layer so mobile and web applications can use the same data layer to get requests from the backend. Other teams started using GraphQL so teams can retrieve the data they need from a single endpoint.
  • APIs to meet the specific needs of car parts sellers: Greater capability here allows our platforms to communicate externally and internally via APIs. This allows, for example, external suppliers to upload all their car ads and parts in bulk to the platforms.

Franciele and the front end development team have been hard at work ensuring the Car Parts platform stands out while elevating the rest of the OLX network (much like Oscar Niemeyer’s Casa das Canoas does). This enables the platform to meet the needs of its unique users.

Of course, to run smoothly, OLX Car Parts must harmonize with OLX Motors and the rest of the network. That brings us to the next architectural masterpiece…

Fallingwater — Frank Lloyd Wright

Lesson = HARMONIZE

Frank Lloyd Wright’s Fallingwater House is a testament to one man’s imagination. Perhaps more importantly, it’s a powerful symbol of how people may live in harmony with the environment.

Fallingwater house from further away, into the nature
Closer view from the Fallingwater House
The famous Fallingwater house in harmony with the nature

“As a front end developer, you constantly think about harmony, both with the OLX platform and with your team. Just as Fallingwater works with its surroundings, we must work with ours,” explains Franciele.

For Franciele, harmony begins with forming good relationships with fellow team members.

“Friday lunches have been a key way to build team camaraderie. The COVID-19 pandemic has forced us to work from home. I like the flexibility of remote working, but I do miss those Friday lunches. We still connect a lot on video, so that’s great!”

Young woman looking towards a beautiful green landscape from what it seems to be a castle

Franciele harmonising with nature…..

In addition to personal connections, Franciele stresses the importance of communication and collaboration between engineers and designers. She believes it can boost creativity and efficiency across the organization.

“We’ve started using a common design system so that we work in harmony!”

BCG Digital Ventures wrote a blog post precisely about what Franciele discusses here. As the piece states about collaboration between engineers and designers, “We have different focuses, different motivations and very different approaches to problem-solving. Fortunately, we have a shared aim: to build an awesome product. We just have to find creative ways to collaborate better and make sure we stay on the same page.”

You can learn more about OLX Design System:

“A design system ensures we’re on the same page,” attests Franciele.

As a woman in the tech field, Franciele also emphasizes diversity and inclusion. Because if we are to build something truly great, we need to bring all voices to the table.

“Diversity and inclusion rely on having mutual respect. Mutual respect is crucial to having inclusivity. Some people have prejudices, and these prejudices can stem from that person not being a nice person. It could be unconscious bias. We must recognize and overcome prejudices and biases,” states Franciele.

“Diversity is important for getting different points of view, so we must be open and bring everyone to the table.”

Franciele’s point is insightful: mutual respect promotes inclusivity. We need to take note of this. Because as an article from Harvard Business Review states, without inclusion, “the crucial connections that attract diverse talent, encourage their participation, foster innovation, and lead to business growth won’t happen.”

Franciele giving a presentation

Team gather in a room, sitting facing one person who's next to a tv

The OLX teams in action

Vernā Myers, a noted diversity advocate, puts this idea best: “Diversity is being invited to the party. Inclusion is being asked to dance.”

To summarize, just as Fallingwater harmonizes and dances with its environment, we must ensure our work environments harmonize and move with one another. If we don’t, there will be no dancing!

View from inside Guggenheim Museum 

Guggenheim Museum — Frank Lloyd Wright

Lesson = CONTINUITY

The Guggenheim Museum has been described as “one great space on a continuous floor.” Franciele thinks engineers should keep this concept of continuity in mind.

“The OLX platform is meant to be one great space. As a Front End Engineer, I focus on removing friction so users have a seamless experience. It should feel like you’re in the Guggenheim!” exclaims Franciele.

To provide such an experience, Franciele and her team use a robust tech stack that includes: React, Next.js, Emotion (CSS-in-JS), GraphQL.

Gif image of Guggenheim Museum, with the floors dancing, showing the idea behind the architecture.
Inside of Guggenheim Museum with focus on the floors
Guggenheim Museum from the outside, in the middle of the city fuss

Franciele is particularly excited about how micro-frontends could benefit the Car Parts platform and OLX as a whole. Software developers like Paul Sweeney have offered insights on the benefits of using this architectural concept. Specifically, Sweeney writes that micro-frontends enable: faster builds, more dynamic developments, and easier scalability without code conflicts.

In addition to the tech stack, Franciele stresses how a common design system plays a role in making the OLX network “one great space on a continuous floor.”

“For instance, a user in Poland moving from the OLX Horizontal platform to the Otomoto Vertical platform should find the transition simple. A common design system can reduce complexity, limit user fatigue, and create a seamless experience for users moving across our platforms.”

View from the Simmons Hall at MIT. A big building next to a field

Simmons Hall at MIT — Steven Holl

Lesson = LEARN

Look at Simmons Hall at the Massachusetts Institute of Technology. It looks like a sponge — a symbol for absorbing knowledge. The 10-story dormitory is designed to facilitate interaction through open spaces and natural light, while also being enclosed.

“Simmons Halls emphasizes the power of learning. Just studying the building motivates me. Working in front end development, it’s important to stay ahead of the curve. The field is constantly evolving,” says Franciele.

Simmons Hall at MIT on the back, green field on the front
Simmons Hall at MIT  during winter, with loads of snow around
Side view from Simmons Hall at MIT 

To stay ahead of the curve, Franciele:

  • Attends conferences and meetups: This allows Franciele to share knowledge and ideas, and learn the latest trends.
  • Stresses attention to detail: As Franciele describes, “I have an attention to detail that came from working as an architect. This allows me to analyze and critique and continually make improvements.”
  • Learns about the users: Franciele points out that front end engineers need research and testing. For example, research has shown the team a lot about The OLX platforms buyers and sellers. As Franciele says, “The huge majority of our buyers are private buyers. Our largest sellers are professionals though. And among the private buyers, the majority are people whose car is broken or needs maintenance, while the others are people looking for upgrades to their car.“

“You have to keep an open mind when researching. You’ll discover things that help you build a better product,” advises Franciele.

This connects to our post with Matylda, Lead Research Designer at OLX Group. While discussing the value of research, she uses a powerful metaphor from The Little Prince. Matylda states:

“In The Little Prince, it’s written that ‘a rock pile ceases to be a rock pile the moment a single man contemplates it, bearing within him the image of a cathedral.’ We should think of all our data and learnings as the rock pile. What we build with it is the cathedral.”

Going forward, as Franciele and her team continue to optimize the Car Parts platform, research will play a big role. Because what they learn can help solve real user problems at scale.

That concludes our first post with Franciele. We hope you liked seeing what architectural masterpieces can teach us about front end development. We’re excited for the road ahead, and look forward to seeing Franciele and her team create more masterpieces at OLX.

Selfie taken by Franciele at Terreiro do Paço, Lisbon. On the back there's the Arch of Rua Augusta
Franciele in front of a building with a particular architecture

Thanks to Franciele Faccin.

0 Comments
Submit a Comment

Your email address will not be published. Required fields are marked *

Share This