Rapid Prototyping via WordPress

WordPress is one of your most powerful tools for UX / UI development in your toolbox.

Troy Dean demonstrates an Elementor workflow that you could use for a minimum viable prototype. The landing pages are made in black and white in order to eliminate design considereations such as colors. Of course you can do similar stuff with other page builders, including Gutenberg.

Video by Troy Dean: how to develop a rapid prototype with Elementor in WordPress.

Pros and Cons

• Pro: it is fast and easy. Via drag and drop you can create nice landing pages in a few minutes. You can transform your wireframes to a working prototype rapidly.
• Con: why not do the same thing in raw HTML / CSS? The editor should be able to save your posts and pages as templates. If not the creation of headers and footers on each landing page is not a permanent working solution.

Conclusion

From a UX point of view the black and white prototype will offer a rapid progress from say sketches and wireframes to a working prototype with focus on intended functionality.

If you want to conduct a UX-test on an intended landing page this method is excellent. But don’t confuse such pages with a finished template in a theme. The prototype is nothing but a nice looking draft.

Since the prototype is easy to make, test and change the method is convincing. If you don’t like Elementor and prefer something else – for instance the new Gutenberg editor – you can adapt Wpelevation’s idea. As long as you’re able to create a fast prototype.

If your editor is able to save such landing pages as templates – so much the better.

Designing the header and footer in a page builder is of cours possible. But is it a good idea? For prototyping probably yes. But in the actual production you’ll have to design a theme with a more permanent header / footer solution.

The next step

At the end of the day you can create fast and working prototypes in this manner. Of course a prototype is not the finished theme. After UX / UI tests the actual development of a theme would – with page templates for the landing pages – be the next logical step.