An effective framework for creating production quality interfaces
Views is an intuitive language to define and build complex user interfaces. Views syntax is clean, intuitive, and functional. Here's a sample:
Text
color deepskyblue
text Hello. Don't be a stranger!
There are no divs, classes or ids. We use styled blocks to compose interfaces. Blocks make the composition easy to understand even for non-technical professionals.
Views lets you build web, iOS, Android and Desktop applications from the same codebase by morphing to React and React Native in JavaScript. It doesn't add a runtime overhead to your application.
Views language and its morphers are open source. You can contribute here.
We're also working on a toolset to enhance the design and development process even more. It is currently in closed beta and we're expecting to release the public beta by Q3 2018. Email us at hi@views.tools and we'll let you know when its ready.
Join conversations:
Views make teams productive. Designers contribute directly to the production build.
Views improve build quality. Designers can tweak styling without wasting dev time.
Views compile to React and React Native. No manual work is required in the compilation process.
Views come with a creative toolset. For designers who prefer tweak over building from scratch.
You can speed up your development.
Perform faster revision loops.
Test innovative ideas.
Reduce the cost of design iterations.
- A strategic partner to deliver their core application to their 50 million users in the USA. Web app.
- Views toolset. Electron Desktop app.
- 2BFIT. Mobile native app AppStore GooglePlay
- Classuite. Mobile native app. AppStore GooglePlay
- Use Views in your project
Open source (code driven)
Using Views Tools (code and WYSIWYG editor for designers) - Compose Views
Atomic Design pattern
Containers and content blocks - Examples of basic blocks
Text, Image, Captures, Svgs
Button, List of cards - Use properties to style blocks
Internal (CSS)
External (slots) - Use scope properties
Control states of blocks
Control when blocks are rendered - Animate scopes
- Keep logic
- Integrate React components
Google Map example
Loaders example - Useful Conventions
- Why not Views?
The value of cross-functional teams is very well known to Growth Hacking community and it's explained well in this book Hacking Growth: Fastest Growing Companies Breakout
Views helps build fast experiments that can be expanded to fully featured products and don't end up thrown away after testing, like it's in a case of prototypes.
Every team that introduced non-technical members using Views on an early stage of product development noticed massive spikes in productivity, motivation, and cross-domain knowledge transfer.
We learn the best from each other and on the job
Because Views syntax, composition, state and logic concepts are much easier to grasp than in a typical HTML, CSS, JS stack, non-technical team members have fewer barriers to start writing code.
We think that the code we write should be beautiful, meaningful, and simple
As a collaboration platform Views removes silos and brings down the walls between development and the rest of the organisation.
We cherish openness, learning, and frequent shipping
We're thrilled you want to help us make better UIs together 😀. Guidelines on contributions to the Morphers
Amy https://github.com/amymc
Larrisa https://github.com/callogerasl
Dario https://github.com/dariocravero
Tom https://github.com/tomatuxtemple
All Morpher contributors
All Docs contributors
License BSD-3-Clause.
Copyright 2017 by UXtemple Ltd.