This project was built with:
Contra x Framer Services Component

Dylan Campbell

0

Low-Code/No-Code Developer

Framer Developer

Framer Designer

Framer

React

Introduction

Ben, the Co-Founder of Contra contacted me on Twitter/X with the idea of a custom Framer component that would be added to the Insert Menu of Framer. The idea was to allow Contra users to seamlessly showcase their Services on any Framer Website just by entering their Display Name. The team wanted it to "feel like magic" with unlimited user customization options to make it flow on any Framer website, so that's exactly what I did!

Project Overview

Scope of Work

Seamless Integration where you insert a contra username, and it populates with Services data.
Work closely with Ben, Josh, and other Contra Engineers.
Tons of customization options

Results and Achievements

Full Customization

One of the main achievements was getting full customization built to ensure anyone could drag the component into their canvas and use the properties panel to make it look like it belongs on their site. Branding, outlines, shadows, fonts, sizes, and more!

Seamless Integration: "It's like magic"

A major requirement was to make the component feel "like magic". From typing in the username and populating their services, to full-scale customization.

Visuals

Component Showcase & Layout
Component Showcase & Layout
Customization Properties
Customization Properties

We build custom React Components for your Framer projects!

Moving Rectangles is a membership-based development studio specializing in both Code and No-Code solutions. I established this studio with a commitment to deliver exceptional value and top-notch quality to our members. Currently, we're soft-launched while strategically assessing the market landscape and actively working on establishing a robust brand presence within this competitive industry.
Like this project
0

Posted Jan 15, 2024

Custom Framer Code Component for Contra, allowing users to display their services on any Framer project.

Likes

0

Views

151

Clients

Contra

Tags

Low-Code/No-Code Developer

Framer Developer

Framer Designer

Framer

React

Contra - Experts Grid (Figma to Framer Component Development)
Contra - Experts Grid (Figma to Framer Component Development)
Safety First Industries' Journey into the Digital Space
Safety First Industries' Journey into the Digital Space
Contra - Case Studies Hub (Figma to Framer Page Development)
Contra - Case Studies Hub (Figma to Framer Page Development)
Moving Rectangles
Moving Rectangles