The RapidUI studio has tons of editing, interactivity, and functionality options, letting you turn your design into a full-on website. In this tutorial, we're going to run you through our recommended RapidUI workflow - so you can get running on building that live site.
- Create a new project
To get started in RapidUI, click the + icon, type in your project's name, and click on the project icon. (Read the full Getting Started guide).
- Upload a PSD/Sketch file
After you've created your project, you'll be redirected to the studio -- where the magic happens.
All you have to do is drag and drop your PSD/Sketch file into the RapidUI studio and watch it turn into HTML & CSS.
Additionally, you can use RapidUI's pre-made elements to build your site; these can be found in the Create Elements panel.
- Make styling adjustments (if needed)
Review your site and make any styling changes you wish.
You can always go back to make styling changes; however, once you've set a breakpoint, you'll have to make styling changes per breakpoint.
- Add life to your design - Rapid Elements & Animations
Now that your design appears on your page, it's time to give it life!
RapidUI has many tools for functionality, interactivity, and animations. There are three different ways to turn your designs into live elements:
- Rapid Elements
- Insert premade objects
- Make your website Responsive - Manage Breakpoints & mobile version
Once you have finished defining your site's functionality, it's time to make it responsive.
Check out how your website looks in every resolution, and make specific changes in breakpoints. Create breakpoints where you want to make changes for specific resolutions, and use the SCALE TO FIT tool in order to make automatic adjustments.
Remember - once you've made changes to your site's design at a specific breakpoint, you will have to maintain that breakpoint design separately. Try to finish your site's functionality and design before creating breakpoints.
- Publish your site
This is the final stage, which results in uploading your site online.
You've uploaded your design file, made it live and interactive, and created responsive versions so it will look perfect in every resolution. Now it's time to publish your site.
Click the Publish button (which looks like this - ) and choose whether you want to publish your site using RapidUI domain, or connect your custom domain.
Congratulations! Your site is now available online :)