Kick start your UX with Mendix DX
featuring Eelco de Vries, Senior UX Designer

 

View this free professional training session to learn the basics of our new UX/UI framework.

Topics include:

  • Page templates, how they work and how they help
  • A new UI framework, how to customize and where to find the components
  • Building better responsive designs using layout grids and form groups in applications

View past Expert Webinars on-demand at developers.mendix.com.



Questions/Answers:

Q: If I have an application that was created before the DX release and want to transition it to use one of the new themes, is there a cookbook for how to put one of the new themes into an existing application?

A: Actually, you could follow the process given on ux.mendix.com for adjusting the theme as well as adding a new one. If you download the GitHub repository of one of the themes, you’ll be able to add the entire repository to your theme folder and work from there. There are a handful of things to consider though: First, the index html file will be changed. If you customized yours, you need to make sure the changes are merged properly. Second, if you had a custom theme in place and load it on top of the new theme you download from one of the Mendix repositories, it all depends on how you created the individual theme whether or not it will have the desired effect throughout your application. If you take these circumstances into account, you are free to load any theme you want, including the ones shown on ux.mendix.com.

Q: What is the best CSS text-editor to use for windows that has the live preview function?

A: Stylizer uses the browser render engines from IE, Chrome and Firefox to render the page so Mendix should work. However SASS might not work since it works directly on CSS files.

Browser inspectors like Firefox allow you to save the CSS file, compensating for potential loss of savings somewhat. SASS as a technology is a means to an end though, so if your workflow is more efficient without it for whatever reason, you are free to adjust your theme that way.

Q: Suppose I want to discard my previous custom theming and replace that with one of the new DX release themes.

A: The same as listed above: you download the theme from the GitHub repository of your choice and load that theme into the theme directory. Be sure to both include the theme repository and the supplied index html file, as it links to the new library and custom CSS file that is the result of the compiled theme.

Q: How easy can jQuery functions be added to the index page?

A: As easy as including the <script> tag in the index file and linking it properly. However, some custom widgets load their own versions of it. This means that, if you plan on using them, you need to make sure you don’t end up with conflicting JavaScript. It is for this reason that you might want to create your own widget which loads the library you need at that particular time, though that would understandably feel less efficient.
   Q: Can we use pinegrow.com?

A: During the webinar I (Eelco) didn’t know the editor, so I checked it out. Setting it up wasn’t as transparent as I hoped, and playing with the trial version I was able to load the login but didn’t get through to the actual Mendix app. It seems that it uses its own rendering, which makes the use of it moot. It works with adding your own bootstrap to, for instance, a blank page, but Mendix has this included already. The result is that I wasn’t able to use the supplied interface on the Mendix app because the render engine didn’t work well with the way Mendix loads asynchronously, as well as the interface that didn’t pick up on the individual Mendix generated components. Unless I missed something in the setup, I don’t consider the editor recommended in its current state.

Q: What can you tell us about the scalability and performance? Can you share benchmarking?

A: Coining these terms in a technical sense – backend and database connection – is out of scope for this webinar session. The front end needs some explaining though:

There are multiple ways to influence front end performance in browsers. The most responsibility to get to a well performing front end in your application is not inherent to Mendix as a platform, but to the business engineer and the way he or she creates the pages. Nesting widgets might generate a complex front end for your browser. Using tables makes browsers trip up, building an interface where everything is nested conditionally, and there’s just too much going on that might hurt the performance in the browser.

Q: Do the responsive templates eliminate the need for duplicate mobile/tablet pages?

A: Definitely not. Dedicated apps are still required most of the time. A simple analysis of questions around responsive design capabilities from a client usually translates to a client that wants the mobile aspect to just not suck. Responsive, however, means the same user journeys and flows through the application are valid in both the mobile and the desktop environment. This is hardly ever the case in data entry roles like administrators, yet often the case in end user roles that provide overview and information management or flow.

Responsive is great, but only if the flow through the application is similar across form factors. If the need on mobile is different than the one on desktop – which is often the case – the argument for responsive design becomes limited.

Mendix does not share, sell, rent, or trade personally identifiable information with third parties for promotional purposes. Privacy Policy

About Mendix

Mendix Can Help Your Business:

Mendix helps enterprises drive digital innovation. Our platform empowers customers to bring new products to market, digitize customer engagement, and automate unique business processes.

Trusted By Top Brands

Brand Logos