#Framer web install
#Framer web update
#Framer web code

#Framer web code

Last year, I dove into the world of code and created my first React native app. Even better, if someone has the Framer Preview App on their mobile device, I can generate a QR Code that allows them to interact with the prototype on their phone, just like the final native app.There's something magical in bringing your ideas to life. This makes it easy to generate share links. Once I have a working prototype, I’ll upload the project to Framer Web. We can always change the shape of the data in my JSON file, but it does have the potential to mirror a potential GraphQL query.

#Framer web update

Phase 3 of the program? Instead of creating prototypes for each use case, I update the data passed in. 12? What happens when the user has overdue payments? What does the app look like when the user is in Phase 1 vs. What does it look like to have 1 notification vs. The state of the app and its design change based on the data passed in. I’ve created JSON files that outline the data. This creates a better workflow for me, but also gives easy access to the engineers on the project.

This only extends my toolset, giving me access to packages like Styled Components and date-fns.Īll code is committed to version control, either GitHub or BitBucket.

#Framer web install

I also have access to the package.json file to install npm packages, like any other project. Meaning, I can write custom ****React components within VS Code, my choice IDE. However, with Framer Desktop, I can directly access the code folder. In fact, Framer Web has more features than Framer Desktop. You can do everything within the browser, through Framer Web.

This keeps unwanted elements out of Framer Framer Desktop Once the design is cleaned up, I have a page in Figma that I use specifically for a hand-off. It has plenty of built-in, interactive components that you can use to build a prototype without writing a line of code. You can import your designs directly from Figma or Sketch or design directly within Framer. This project seemed like the perfect opportunity and the perfect fit. I’ve known about Framer for years but never explored it as an option. They could pull it up on their mobile device and feel like they were using an application - no smoke and mirrors. I wanted to create a prototype that felt real. The point is: it’s a different medium it’s a different device than how the end-user will experience the final product. When you’re designing a native application, you’re pushing pixels on a laptop or a desktop. The best designers at prototyping are the best communicators.Īt that moment, I knew that the most effective way to get stakeholders on board was to create a prototype true to the app’s experience. The best designers at prototyping are the best communicators. One of the skills they talked about was prototyping. About the same time, I was listening to the Design Details Podcast, Episode 377: Future-Proof Designer. In November (2020), I started working with a new client, designing a native application. “Oh, I didn’t realize that’s what you meant.” Priming There was even a fair amount of redesigning once developers got involved. While this worked for some clients, others still had trouble making that leap, however big or small. The user will scroll down, and this will happen…” But, during pitches, there was still a considerable amount of hand waving and, “Imagine this. If anything, it demonstrated how screens were linked together. I was taking static images, creating hot spots, and linking them together. Now it’s about building things.” - Frankly, I’m not sure why “playing around” and “building things” have to be mutually exclusive.Īre we talking about the same product? My Storyīefore Framer, we were using Invision for prototyping. Then, as if to drive the nail in the coffin: “Framer used to be about playing around. Or, on the opposite end of the spectrum, over-empowering UX engineers who over-value the code.

In doing so, it’s alienating designers that aren’t code-savvy. The leading case this post made was that Framer was at fault for moving toward React. Looking at new features alone, it’s very much alive and well. Two weeks ago, Framer launched a new home page design and Smart Components, with Variants coming out of Beta. Sadly, this post has gotten some traction, and I’ve seen it pop-up on several round-ups. I’ve been using it non-stop for the past month. A love letter to my prototyping tool of choice.Įarlier, this week, this post came across my feed: “ Framer is Dead.”