Page cover image

Get started guide πŸ•

We get it. You have a short attention span. It's cool, let's keep this really simple and short.

In Sketch or Lunacy

  1. Create a new file ⌘N

  2. Rename the Page 1 page πŸ‘‰ App

Rename the page from Page 1 to App. The App page is where the magic happens
  1. Create a new Artboard (A) size does not matter

  2. Rename it from Artboard πŸ‘‰ Start

You need one Artboard named Start or nothing will work
  1. Save your Sketch file

  2. Open up Marcode app

In Marcode

Pretty obvious yes? 😺πŸ’ͺ
  1. Press on the Link a Sketch file area in our app

  2. Locate your newly created Sketch file from the steps above

  3. It should look like this πŸ‘‡πŸ€–

Blank, yes of course, we have not done anytyhing in Sketch yet
  1. Let's add a background color to our Start Artboard and see what happens

  2. Ours looks like this πŸ‘‡

We added a Background color πŸŽ‰
  1. Save in Sketch and now look inside Marcode app, should look like this πŸ‘‡

Great work!

What have we learned?

  1. How to create a blank Marcode starter template in Sketch

  2. How to connect the Sketch file to Marcode app

  3. How to add a background color to our first Artboard, that always need to be named Start (never ever take this one away, our app will break). Start is the index.html page.

What do I do next?

  1. Learn our markup, it's super easy

  2. Add as many new Artboards as you might need, but always keep Start (index.html)

  3. Start with our {prototype} components, a very fast way of getting 1:1 designs out to iOS, Android and HTML apps

  4. Have fun! 😺🧑

Download above Sketch file

Last updated