As mobile technology continues to advance, it has become increasingly crucial for designers to effectively display their designs on the intended platform. The UX/UI design tool Figma simplifies this task. This article will provide instructions on how to run a Figma prototype on your mobile device.
Step 1: Install the Figma Mirror App on Your Phone
The first thing you’ll need to do is install the Figma Mirror app on your mobile device. This app is available for both Android and iOS platforms. After the installation, open the app and sign in with your Figma account.
Step 2: Open the Figma File on Your Desktop
If you have not already done so, open the Figma file on your desktop. Make sure you are logged in with the same account as on the Figma Mirror app. Navigate to the prototype you want to view on your phone.
Step 3: Run the Prototype
At this point, you are ready to run the prototype. To do this, click on the “Present” button at the top right corner of the Figma interface. This will open a new window with your prototype.
Step 4: Connect Your Phone and Desktop
Now you need to connect your phone and desktop. On the Figma Mirror app on your phone, you should see a four-digit code. Enter this code into the input box on the Figma desktop interface, located at the bottom right corner of the prototype window. Click on the “Connect” button.
Step 5: View the Prototype on Your Phone
Once your phone and desktop are connected, the prototype should automatically appear on your phone. You can now interact with the prototype on your phone just like you would with a real app.
// Example of a button in Figma prototype <button class="btn btn-primary">Click me</button>
And that’s it! You now know how to run a Figma prototype on your phone. This can be a great way to test your designs and get a feel for how they will look and function on a mobile device. Happy designing!