Because we want let people use our app with their own tools, we decided to make the lmml (Live Mockups Markup Language) file format open. It’s a simple xml file containing some “objects”.

Let’s start with an example :

  1. <Scenar>
  2.   <files>
  3.     <File>
  4.       <name>first-screen.png</name>
  5.       <actionsPortrait>
  6.         <Action>
  7.           <coords>{{68,126}, {144,28}}</coords>
  8.           <link>second-screen.png</link>
  9.         </Action>
  10.         …
  11.       </actionsPortrait>
  12.       <actionsLandscape/>
  13.       <imagedataPortrait>Base64 data</imagedataPortrait>
  14.       <imagedataLandscape/>
  15.     </File>
  16.     …
  17.   </files>
  18.   <rootFile>first-screen.png</rootFile>
  19.   <imageMode>AspectFit</imageMode>
  20. </Scenar>

A scenar has a collection of files, a root one and an image mode. The imageMode let user tell LiveMockups to deform images of each screen or not (AspectFit or ScaleToFill). The rootFile permit LiveMockups to take an file to show at startup.

Each File has a name and corresponds to a mockup. It can have one or two orientations (portrait, landscape or both). The File has images data base64 encoded for each orientation, and actions also.

Action permits to tell LiveMockups that a touch in the coords area will led to changing the currently displayed File for the one in its link attribute. The coords are in pixels {{x,y}, {width,height}}, so you can check them directly from an image. A File can have multiple actions, specified for each orientation.

Pretty simple ?

5 Responses to LiveMockups file format

  1. George says:

    Hi guys,

    found what seems to be a few bugs. Firstly, it can’t handle links in symbols and secondly, it can’t handle links in balsamiqs “Iphone Menu”. My workaround was to break apart symbol in each wireframe and put a rectangle with no borders and max opacity on top of the “iphone menu” – fields I had linked.

    Works but time consuming and makes me a bit scared of using your product, is there a fix in the making?

  2. admin says:

    What do you mean by “symbols”, which composants are they ?

    We will update the Maker to manage links in iPhone menus.

    • Chris Lees says:

      Did this ever get fixed? Could also be my problem, and makes the app worthless to me as all I use Balsamiq for is iPhone mockups… What else doesn’t work I wonder…

  3. Lukas says:

    first of all thank you for this cool app. What I’m missing is that you can’t scroll the screens. Is anything planned?

    Best regards,

  4. admin says:


    Scrolling a screen may be a nice feature, the big deal is to keep the use as simple as it is now. Let’s talk of this by mail.


Leave a Reply

Your email address will not be published. Required fields are marked *


You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>