Creating an interface allows you to share your model with others, especially those who don't have the experience to comfortably work with models in Stella's model building environment. Interfaces can range from relatively simple exploration environments, allowing the user to change one or two things and see the results, to rich interactive experiences, taking the user on a journey of discovery through multiple levels of interaction.
Independent of the complexity of the interface you develop, it can be delivered as a web page so that anyone with a modern web browser and an internet connection can use it.
Building an outstanding interface requires attention to detail and a clear understanding of the people who are going to use it, but the development mechanics are very straightforward. Interfaces are simply a sequence of connected pages, and Stella Designer provides the tools to set up and connect these pages while filling them with interesting content.
A page is a collection of content that appears together: graphs, tables, pictures, videos, sliders, buttons, and other objects. When published, a page is a web page, typically with links to other pages.
A story is a sequence of pages, each displaying some part of a model's structure. Typically, more model structure is revealed page by page as the story progresses, until, at the end of the story, there's nothing (that affects behavior) still hidden. For example, a stock by itself doesn't change; a stock with an inflow changes based on that inflow; a stock with an inflow that depends on the stock changes based on the feedback between the stock and inflow. By revealing first the stock, then the flow, then the connection from the stock to the flow, you can illustrate the three different types of resulting behavior.
An interface consists of a collection of pages and stories. Each page, even though it'll be closely related to other pages in the interface, stands alone. Navigation between pages can take any form you want, although it's typical to have some sequence and hierarchy, like pages in a chapter and chapters in a book. Stories are themselves a collection of pages, but, in this case, the pages are arranged sequentially. Stories have a beginning and end, with a clear definition of the previous and next page in the sequence (but it's still possible to enter and exit stories at points other than the beginning and end).
Get the model to the point that you understand its lessons
Modeling is a process of discovery. You won't always know ahead of time what a model will tell you. Interfaces, on the other hand, need to build off the understanding of model behavior. While the lessons will be new to the user, they need to be designed into the interface in a clear and easy to follow way. New insights into model behavior may require an interface redesign, or suggest new ways to present the material. So, while interface and model development can proceed in parallel, maintaining room for design change during active model development is good practice.
Pick an Interface Size
It is important that people who use your interface enjoy it. See the Interface Settings Properties Panel for discussion of the different choices. Once you pick a size and develop content it will be difficult to change this selection (especially if you are trying to make it smaller). If you are targeting multiple devices for which different selections make the most sense you may want to build two copies of the interface and publish to two different locations.
Map out the logical structure of your interface
Most interfaces have a welcome page, some explanatory content, and then one or more paths to explore the behavior of the model, as it responds to choices the user makes or changes in model structure. Laying this logic out ahead of time, even by simply sketching out what different pages might look like on paper, can be helpful. You can also start by setting up pages with nothing but text for titles and buttons for navigation, so you can walk through the flow that the user will experience, even if you're not sure what your content will be yet. Stories, which by their nature are sequential, should be written out in this chronological structure from the start, but the details can be filled in later.
Once you've decided on the process the user will use to interact with the interface, you can start to add content to individual pages and fill out stories.
Fill out the pages
There's no standard appearance for a page in an interface. You should include some mechanism for user input, and some way for the user to see the results of their actions and the results of assumptions being made. Simple interfaces can be a single page, with inputs and buttons appearing together with outputs. Sometimes it's easier to break the inputs up into a variety of different pages; this is especially true if there are different roles associated with the different inputs.
No matter what goes onto the page, the process of putting it there is the same. Select objects from the Interface Build toolbar and drop them onto the page. After that, you can adjust their appearance and content until you have what you're looking for. If you want to maintain consistency across pages in an interface, set the objects up the way you want them on one page, copy them, and paste them into another page.
Write the stories
Interfaces don't need to include stories, but stories are powerful teaching tools and can make the user's experience more interesting and memorable. When done carefully, each step in the delivery of the story is intuitive (but not quite obvious), while the last step, when compared to the first, would be quite surprising. An easy way to achieve this is to start with the 5 most important steps that convey your message, then add or consolidate steps until the flow is engaging and informative. Getting your prospective users to give you feedback on the story (and the rest of your interface) early on will help ensure you reach your target audience.
Refine the Interface
After you've written an interface and set it up the way you want it, make sure to try it out from a user perspective. Then you can adjust it until it's easy and intuitive to use, and make the final user's experience that much better.
Publish or Present the Interface.
You can publish your interface directly from Stella Designer using the Publish menu item on the File menu. Once published, you can let people know about it, and, as long as they have an internet connection, they'll be able to use it. You can also use Presentation mode to show it to other people without publishing it, or give the model to anyone with Stella Designer to use on their own. Other options, including the creation of standalone applications, are also available.
The tutorial Building a Simple Interface will take you through the mechanics of creating an interface with a story in it. Creating more complex interfaces uses the same mechanics, but more of the available objects and options. To learn more about the different objects you can use in interfaces, see Objects and Properties.