Behind the Scenes: Why We Made UI Changes

In this post, I want to explain how and why we recently decided to implement several UI changes in our editor. In the process, I hope to shed light on the vision we have for Elementor, and how this vision helps us build the right relationship, communication and trust with members of our community.

Over the past few months, Elementor joined the few plugins to cross the one million active installs mark. There are a variety of reasons that explain why Elementor has become an industry leader, but three key reasons include our clear vision, the support of our community, and how these two sides are synergetic.

The Elementor community has been fundamental to our success. Since day one, users supported us, helped spread the word, mentioned and shared our work. We quickly grew from the ground up, and we certainly don’t take this for granted.

While the first couple of years included positive support pretty much across the board, as we grew, reaching over a million active installs, other voices began to appear. This makes sense – a million users, a million needs and wants.

Uproar Over Right-Click

For Elementor v2.1, we made significant modifications to the interface and moved the editing handles from a frontend menu to a right-click menu. This update prompted a lot of conversations in the Elementor community. Some liked the change, other less so.

Why we Made the Change in the first place

We see Elementor as the new standard solution for building websites on WordPress. This puts great importance on offering a clean design interface, enabling users to focus on their design.

When you think of it, no other software displays the delete and duplicate buttons on the frontend, not even basic software like Word or PowerPoint.

Right-click has become standard practice for interfaces, and combined with keyboard shortcuts, provides users with a streamlined process. The multiple frontend handles caused much confusion among our users, and sometimes also created conflicts when handles became hidden, invisible or partly covered by other elements.

The transition to right-click also allowed for additional and crucial capabilities such as copy-paste styles, the recent navigation tree and more.

Voices for and against the change

Following the right-click release, raging posts popped-up in the Facebook community. We also received email complaints, and even a few bad reviews made by users who, apart from right-click, really loved our product. 

This was the worst reaction we’ve ever received, and I must admit, it took us by surprise. We spent a long time checking and proofing this change, along with an extended Beta period. We thought it was going to be accepted with open arms, and that users would experience it as a significant UX improvement.

We read all the comments, talked personally with many users, and did our due diligence, attempting to understand what went wrong in our process.

Listening to your feedback

While we have a clear vision for our product, we have just as much regard to listening to user feedback. In fact, about 80% of our product features come directly from user feedback.

For right-click, we came to the conclusion that while the change needed to happen, we were too fast to release it. As I am writing these lines, several weeks after the update, it seems that users have grown accustomed to it, even the ones who complained at first. We might have been better off introducing this change in steps, and gradually letting users get used to it.

In the past few months, we worked hard to make it easier for all users to adjust to Right Click. 

Here is what we did:

Differentiation of Right-Click Actions

During our user-research, we realized that the extra click was not really the main UX issue. In previous versions, users already had to hover over a handle area to show the handles. 

Upon examination, the real issue seemed to be the difficulty in recognizing which right-click item did what. To deal with this problem, we added relevant icons to the edit, duplicate and delete and add column buttons. To make it even easier, we added a red background to ‘Delete’, which now appears on hover.

Better Keyboard Shortcuts

We came to believe that a combination of keyboard shortcuts with the right-click menu is the winning set, both integral to the design process. We recently significantly improved how our hotkeys work and plan to continue to advance them and add more shortcuts in the future.

Gradual Change

I must emphasize that the feedback to the right-click was mixed. We received much encouraging feedback regarding the change. Users complimented the increased accessibility, as well as the added value of the copy-paste features.

In the latest release of 2.2, we decided to cater to the users who missed the old handles, and offer them a way to bring back the frontend handles alongside the right-click menu. We understand the difficulty in shifting work methods and want to provide a more gradual transition to the right-click.

Improving how you Get Started

As part of our aspiration in offering the best user experience, I want to share a new education resource we are planning for our site. This resource will help users learn how to use Elementor better, and develop an efficient work process.

If you install Elementor 2.2 on a new site, you will notice we added a ‘Getting Started’ window, that includes a short introductory video. This is the first of many steps we plan to make that will help ease the onboarding process for our page builder.

Moving Ahead With Our Vision

The other main reason that enhanced our growth, besides the community, is the fact that we are a company led by a clear vision for our product, and not just numbers.

We set out to build Elementor with a clear idea of improving WordPress web design. We came from this industry, after experiencing the roles of both theme company and design studio, and aimed to revamp it.

The main difference between this approach and a strictly growth-based approach is that we sometimes make unpopular changes, and we do so to optimize the product, not to increase sales.

This approach also fuels us to improve the smallest details of our product, and not just to innovate for the sake of innovation.

Renaming Widgets

As I already mentioned, we take our role seriously. Our team tries to take into close consideration the smallest details, even widget names. We recently changed the name of the ‘Columns’ widget to ‘Inner-Section’.

During a continuous period of user-research, we found a disturbing commonly repeated mistake made by users of all levels. When users needed to add a column to an existing section, instead of doing it using the ‘Add new column’ option in the right-click, users mistakenly dragged in a Columns widget.

This rename brought on some displeased voices in the group earlier today. I totally relate to the frustration, since our team also now needs to re-do several of our YouTube tutorials and Docs that refer to the previous name of the widget.

Nevertheless, we made the change because we have to consider the greater good of our million users, as well as our future users.

What We Learnt

Changes can be intimidating, especially with regards to interfaces. You are used to a certain way of doing things, and your brain develops processes to make automatic behaviors that take less effort. A change – whether it is UI-based, relocation, a new job… requires developing new automated processes, and can often be quite frustrating. But you do get used to it after a while (I read somewhere it takes two weeks).

If you are an Elementor user, you are part of our project. It means you share our vision and our long-term and continuous task – to build the ultimate solution for building websites. We always strive to be the best, to get feedback and to progress. To accomplish this, we need to make changes continuously.

We are developing new ways to make these changes in a more streamlined and less obtrusive manner. We ran a recent user survey, started developing a broader QA department, prolonged our Beta versions and set out to create better in-product as well as online education resources.

Summing Up

I wrote this post to offer our perspective, in regards to the recent updates. I also wanted to let you know that although we are growing, the same user-oriented mentality leads our way. We plan to find new ways to improve the communication with each and every one of you, our users, all the while continuing to develop a robust, community-driven product.

About the Author

Yoni Luksenberg
Yoni Luksenberg
CoFounder at Elementor, Designer, Entrepreneur, Father, Dreamer, Creator, Lego Builder.

Share on

Share on facebook
Share on twitter
Share on linkedin
Share on whatsapp

Liked This Article?

We have a lot more where that came from! Join 885,286 subscribers who stay ahead of the pack.
By entering your email, you agree to our Terms of Service and Privacy Policy.

Comments

33 Responses

  1. I started with Elementor not long ago so only knew the right click, i have to say having the option of hover to get the commonly used actions is now equally as intuitive.

    Really enjoying what you are doing with the development and look forwards to each new beta.

    Would be to see further integration of Act fields including the ability to use image galleries to populate sliders, the option to use a colour field to populate the background overlay and the option to populate a tab or accordion content from a field including a Vimeo album.

    Also love the woocommerce integration, the main reason I moved. Would love to see more control over the archives to include the ability to control the content of the cards like adding a more details button link, the short description and generaĺ styling. Basically an individual card builder rather than dragging on a block of featured products etc.

  2. Thanks for offering your insights on the reasoning and planning at Elementor. I for one am happy to see your simplifying the interface and basically getting out of my way to design. I hope more is to come.

    I was among those frustrated by the changes you mentioned more so because, my fault I’m sure, I don’t recall any notice of these changes. My site updated to the new version and boom I was lost.

    Once I discovered what the changes were I was fine and moved on. So maybe better communications when changes are implemented even for those like me who don’t read every little thing and tend to just jump in head first.

      1. Looking forward to it Ben Pines!! And thank you for all of your hard work Team Elementor, and making us a part of that team by listening to our voices and help develop a great product. You will not be able to please everyone, and yes, Elementor is different in many ways to other builders, but still the easiest to use and learn 🙂 An overhaul of the videos in the widgets section of the docs.elementor.com would be helpful and beneficial as well.

    1. GREAT suggestion David!!! I am slowly learning code and have ideas I would like to see come to fruition. It is hard finding a dev to assist that either does not have a conflict of interest or charges an arm and a leg, plus I would like to do it on my own (hopefully).

  3. I’m fine with the RMB popup and getting to know the Navigator. The one thing I miss is some Navigator like widget to quickly switch between templates. At the moment it is 4 to 5 clicks with a couple of full page refreshes to get to another template so some kind of one-click one-page-refresh Navigator like widget to switch template focus would be wonderful.

  4. Negative voices are often the loudest I, for one, love these changes and think they have been huge improvements.

    The column widget didn’t always make clear sense to me, but its new name makes it crystal clear.

    The right click has added a ton of value as well. I feel like I can more quickly get a hold of the sections I want and make the changes quicker like this. The fact that there is less UI to look at is a winner in my book.

    Keep up the great work!

  5. Bravo! This attention to detail and care for the user experience is what sets Elementor apart. Sure, these changes could be introduced more gradually, or be flagged up to Elementor users who aren’t in the FB group every day. But it’s a fine balance for sure, and you (as a company) are learning as much as we, the users, are. Superb post, thank you Yoni.

  6. I love Elementor…and I love the developers. I own the Unlimited version of Elementor Pro. But I was enraged by the right-click thing. Why? Not because I’m averse to change. Not because I’m old. Not because I’m fearful. Not because I like to complain.

    It’s because, for some of us Macintosh users, the right-click was (and still is far as I know) deeply flawed…it doesn’t work correctly. Right-clicking things often makes them just disappear. Right-clicking things often results in some kind of “icon” attaching itself to the cursor and dragging along everywhere we move the cursor. Extremely annoying. It makes Elementor unusable.

    Elementor tech support finally admitted this was a “bug” and said they would fix it. Maybe it’s fixed in 2.2…but in 2.1 it’s still a problem.

    Finally, a user discovered that right-click works OK when using the Firefox browser…so now at least Elementor is usable again…but only after weeks and weeks of turmoil…and only if I use a browser that I don’t want to use.

    Elementor is the best thing that ever happened to WordPress, and I’m looking forward to using it for a long time to come. I just hope the Elementor developers might work harder to prevent some of the insane problems that come with some of the updates.

  7. Ben, I really like when I see “Ben from Elementor” in my inbox.. It instantly comes to my mind: “Let’s see what great new feature we have here!”
    As a web design studio founder, I think the continuous work you people do in a daily basis to improve, enhance and add value to Elementor is absolutely outstanding and REALLY difficult to find in other companies. We appretiate the effort as much as we love Elementor. Thank you and please keep up bringing us these great new features!!

  8. Technology changes all the time, so anyone working with technology has to be adaptable. I was uncomfortable with the right-click menu change at first but within a day it was as if I’d never used anything else. Having edit, copy, paste, delete options in one place is much more efficient. I would like to see an option to move the widget list to the left-hand of the screen. As the majority of mouse/tracker users have a right-hand location for their mouse/tracker on the desk, it is much more efficient to locate the widget you are going to use at that location. For some this would be an awkward change but you rarely miss having to travel across the screen to use a widget once its right next to where your mouse pointer is most frequently located. Just a thought 😉

  9. I really love to work with shortcuts and right-click in the browser. It feels nearly like a desktop app. My wishes for one of the upcoming versions: Please add a shortcut for the Elements/Global icon (the grid icon located top/right position in the sidebar). So the user can switch faster between editing and widgets mode. Further support for the “Page Up”, “Page Down”, “Home” and “End” keys would make sense. And also a better and more prominent way to navigate to the different Elementor pages from the “normal” WP area would be nice. At least you could highlight the “Edit with Elementor” link in WP pages area a bit more.

  10. Hi,

    I have been using Elementor since the time it was introduced as a free plugin. With severe opposition from my then company, I stood by this plugin, as I loved the code. There were literally no docs then, so to create my own elements, spend some time on it. Eventually, now my ex company with whom I still do outsource projects purchased pro. While the growth has been wonderful, I feel some parts have been ignored which are essential.

    1. Nav menu. It’s very very basic compared to other plugins and today design requirement. Seriously need to work on hamburger icon, give some option to make changes, the bars are so think.

    2. More post/portfolio skins, especially what’s with no post slider , hover effects, etc.

    3. Slider behind header, I can add video as background video but not slider, something which is so common.

    Just a thought.

    I still love the plugin, simply the best

    Thank you.

  11. I’ve used Elementor ever since it was in Beta. I continue to love everything about it and how you guys continue to strive for excellence.
    I’ve learnt that even though small changes can often temporarily be a inconvienience, understanding the WHY behind the WHAT always puts things in perspective helps reveal the bigger picture.
    Thank you Ben and the team for always being so public-facing and open to your audience. I am one of your biggest fans.

  12. The right-click functionality is just perfect and very welcomed feature of Elementor. For example, the copy element and paste-style functionality makes the development (and changes) much easier and faster. Thank you to the entire Elementor Team!

  13. You do a great Job I spent several years playing around with WordPress Theme and Framework Elementor is the Best I ever met, I’m developping our new business website and every hour spent on the development is pure Heaven! Thank you guys for such a great job It was a real pleasure to change for PRO version and helping new customers with their website.

  14. You – rightfully – added in the ability to put the handle buttons back which solved my problem. For me and people that use Elementor every day it was suddenly extra steps. Where before you could move your mouse to the corner, and click duplicate. It now became move your mouse somewhere, right click, scroll down to the option, click that. It’s tiny steps that add up when you do them a million times. So making a semi 1 step process (hover / click) into a 3-4 step process didn’t feel like progress to me.

    You let us turn it back on so I’m good – however that’s my take on it. Not as fast/convenient = not better. That being said you guys are making a great tool.

    Separately here’s an issue I have all the time which is adding a ROW to a section. If you have columns already and try to add a second row it only lets you stick an inner-section into an existing column. But what if you want 3 columns in one row, then 2 in another row – and then 1 but all in the same section? Not easy to accomplish, just FYI. Divi’s handling of this seems perfectly normal but it’s a real pain in elementor. #Feedback

  15. UX is not actually the main problem, The biggest thing still missing in Elementor is global styles settings for types, titles, paragraph, buttons, background, decorations, effects, breakpoints, etc.

  16. I’ve been using Elementor for 6 months and I didn’t even know there was a right-click feature lol
    I love that Elementor is always evolving and making it easier to create websites on WordPress

  17. I am an Elementor Pro user and love the product. I find your updates and modifications to be very well thought out. I realize there are always pros and cons to every decision. I recommend Elementor to all my clients and colleagues. Keep up the good work.

  18. Yes agreed! I love seeing that ‘Ben from Elementor’ email.
    The right-click & navigation tree are huge improvements for me. Love them and they’ve resolved a number of issues I once had working with non-standard layouts in Elementor. Excellent work peeps!~

Leave a Reply

Your email address will not be published. Required fields are marked *

Want to learn how to build better websites?

Join 885,286 Elementors, and get a weekly roundup of our best skill-enhancing content.

By entering your email, you agree to our Terms of Service and Privacy Policy.