By using our website you agree with ourPrivacy Policy.

Post Details

A Quick Start Guide -Design to Code with Monday Hero šŸš€

N
Nazli Temurtas

25 Feb 2021

cover

From signing up to creating the first project.

This article covers the system requirements, shows the process from the beginning to creating the first project, and inviting team members to Monday Hero. In the end, you will be ready to start your project!


The things that you need to use:

  • A MacBook or iMac to import a design file to Monday Hero.

  • You can work on your project via the Web App which supports every OS.

  • Sketch App or Adobe XD (You donā€™t need to design for our tutorials, we will provide the template files that you can follow or you can invite your designer colleague.)


1- Firstly, sign up.

You can click here to go to our website. Pick a username, enter your e-mail and password. You will use this e-mail to log in to the Monday Hero.

Sign up screen./w Monday Hero

2- Download

  • You can automatically download the Monday Hero Mac app here.

Note: You can only import the design file to Monday Hero via the Mac app.

Download Monday Hero

In your first run, you may see a warning. This is normal for your security check in your Mac.

  • If you see the ā€œContact the developerā€ warning, you can solve it by following the steps below.

ā€œContact the developerā€ warning

You should give permissions from Apple Menu ļ£æ > System Preferences > Security & Privacy > General. Open Anyway and click to Open again. Then, it will no longer ask.

Monday Hero give permission

3- Log in and create your first project.

  • You can create your projects as an iOS or Android project. In the end, you will get Swift or Kotlin code as you prefer.

How to create a new project in Monday Hero

How to create a new project in Monday Hero.

If you want to create your project in Android, which is in Private Beta now, you can Join us on Slack or Discord, introduce yourself in #android-beta-request channel and get an beta access!

  • When you open your project, you will start with an empty project. You can export your design from Sketch or Adobe XD via the Desktop App.

A project with no screens

A project with no screens.

  • If you donā€™t have the design, you can also invite the designer of your team/project to your project. They can see the project and export the design easily.

Invite designer

If you have trouble with exporting the design file, here you can follow the guide about Import Design File Into Monday Hero. šŸ‘‡

All done! You are good to go build your project! We are working on tutorials, new features, and improvements, stay tuned!

Please note that: itā€™s also possible to watch Monday Heroā€™s Mac App in the 6-minutes-video below. In this tutorial, you can learn:

  1. How to upload designs to Monday Hero,

  2. Monday Hero platform,

  3. How to create components like buttons, text fields, and lists,

  4. Exporting code and launching on a mobile device.