Design & Code Made Easy
TiDesigner is the perfect tool for designers and developers looking to create stunning mobile app interfaces quickly and easily.
With its intuitive interface and powerful feature set, TiDesigner empowers you to design beautiful and functional mobile apps using regular Titanium SDK Components.
For iPad and Mac OS
Get your copy today!
-
Version 1.0.7
-
English and Spanish
Builder Panel
TiDesigner's main feature is its Builder Panel, which is composed of four major views: the Components View, Stack View, Canvas View, and Properties View.
These views work together seamlessly to provide a comprehensive interface for designing app interfaces.
You can select from a list of Titanium SDK components in the Components View, group and rearrange components in the Stack View, visualize the design in the Canvas View, and modify the properties of components in the Properties View.
What Makes TiDesigner Different
TiDesigner's key features include comprehensive visual design and editing tools, a built-in library of stock photos and icons, code generation for iOS and Android platforms, and the ability to create quick mockups with export options.
Great visual design and editing
Design, arrange, and customize app components. Real-time preview helps visualize designs on different devices.
Built-in Stock Photos and Icons
Access high-quality images and professionally designed icons within TiDesigner, eliminating the need for external sources.
Code generation and Quick Mockups
Generate code for iOS and Android with a single click. Use the Quick Mockups Panel to create stunning design visualizations.
Discover powerful features to boost your productivity
Wide range of features
TiDesigner provides an array of tools that empower designers and developers to swiftly and effortlessly craft impressive mobile app interfaces.
-
Builder Panel: A comprehensive interface comprising the Components View, Stack View, Canvas View, and Properties View for designing app interfaces with Titanium SDK components.
-
Code Generation: Automatically generate code based on your designs created in TiDesigner.
-
Quick Mockups Panel: Create attractive mockups of your designs and share them effortlessly on various social media platforms.
-
Files and Folders Panel: Organize project files, create, rename, delete, and export them as a zip file.
-
Color Picker Panel: Conveniently select colors for your app interface design.
-
Keypad Panel: Input numerical and hexadecimal values with ease.
-
Settings View: Customize project-specific settings, including project type and background color, to suit your needs.
-
Dark and Light Mode Support: Optimize your work experience by choosing your preferred visual mode for a comfortable environment.
Stories From Our Customers
Read what our users have to say about their experience with our App. Learn how our application has provided value to them through their testimonials.
Awesome work!
Congrats!”
You’ve just made wireframing apps 1000% better.”
This will likely totally change the game for Titanium development.”
Super clean dude. Simple yet packed with options. Loving it!”
Just one word:
Amazing!”
Your work will boost up development. Thanks.”
A fantastic expansion to the Titanium ecosystem.”
Impressive!”
Quick Mockups Panel
Allows you to create beautiful mockups of your designs. You can share these mockups directly to social media platforms such as Facebook, Instagram, and Twitter.
TiDesigner offers multiple code generation formats
Regardless of the chosen format, the generated code is compatible with both iOS and Android platforms. You can easily copy the code from the Code Panels and paste it into your Titanium project, enabling a streamlined process to recreate your design with just a single click.
-
Classic: Generates JavaScript code in the Classic syntax of the Titanium framework. Is a straightforward representation of the UI components and their properties using JavaScript.
-
XML: Represents the structure of UI components and their properties. This code is utilized in Alloy projects, where it serves as the view layer, defining the UI structure using markup and assigning unique IDs to components.
-
TSS: It defines the visual styles and properties for UI components, associating them with the IDs assigned in the XML file. The TSS code resides in a separate file and helps maintain a clear separation between the visual aspects and the logic of an Alloy project.
-
JavaScript: It handles the logic and behavior of UI components, events, data bindings, and other interactive functionality. In Alloy projects, the JavaScript code can reference the IDs assigned in the XML file to target and manipulate specific components.