Project Concept

This project will introduce how to create complex user interfaces that are simple easy for users to take in information. Sophisticated websites can be built from combining simple Widgets and basic styling.

Following the steps in this guide, you will organize and configure a UI to show information that will be beneficial to users.

We will teach you how to create a user interface that affectively conveys information to users.

Project Info

Type Best Practices
Level Intermediate
Est. Time 60 Minutes
Published June 14, 2018
Author Al Smith

You'll learn how to

    • Organize UI elements in a Mashup layout
    • Use the Repeater widget effectively
    • Use Styles to customize UI elements within a Mashup
Register to Start Project

Things used in this project

Environment:

This guide requires a connection to the ThingWorx Foundation.

It assumes that you are utilizing the 30-day hosted Foundation server or the 120-day downloaded trial.

Software components:
Previous knowledge:

DESIGN AN EFFECTIVE UI

Outline
  • Step 1: Top Level Layout
  • Step 2: Import Data
  • Step 3: Map Mashup
  • Step 4: Navigation Panel
  • Step 5: Repeater Widget
  • Step 6: Customize Repeater
  • Step 7: Detail Panel
  • Step 8: Learn More About Widgets
  • Step 9: Next Steps