Effective UI Implementation
Discover how ThingWorx Widgets can be implemented in a compelling Mashup design.
Project Concept
This project will introduce how to create complex user interfaces that are built by combining simple Widgets and basic styling.
Following the steps in this guide, you will build a web application showing both geographic and table based information.
We will teach you how to create a professional user interface that effectively conveys information to users.
Project Info
| Type | Best Practices |
| Level | Intermediate |
| Est. Time | 60 Minutes |
| Published | October 17, 2018 |
| Author | Allen 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
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:
ThingWorx Foundation
Previous knowledge:
EFFECTIVE UI IMPLEMENTATION
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