# Help visual project - “modernize” the software visually

**URL:** <https://clarionhub.com/t/help-visual-project-modernize-the-software-visually/5170>\
**Category:** questions\
**Tags:** windows\
**Created:** [June 1, 2022, 1:14pm UTC](https://clarionhub.com/t/help-visual-project-modernize-the-software-visually/5170 "2022-06-01T13:14:30Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![julian\_agile](https://clarionhub.com/user_avatar/clarionhub.com/julian_agile/32/3145_2.png) [@julian\_agile](https://clarionhub.com/u/julian_agile)\
**Post date:** [June 1, 2022, 1:14pm UTC](https://clarionhub.com/t/help-visual-project-modernize-the-software-visually/5170/1 "2022-06-01T13:14:30Z")

</div>

Hi,!  
I have recovered an application developed in clarion and I would like to “modernize” the software visually.  
Do you have some advice to give me to make the buttons look more modern for example?

[Capture|690x357](https://clarionhub.com/uploads/short-url/8MZ1kQOFdj3CW1DryJVcFkMPNHH.png)

Thanks,  
Julian.

---

<div class="post-metadata">

**Author:** ![anon23294430](https://clarionhub.com/user_avatar/clarionhub.com/anon23294430/32/3829_2.png) [@anon23294430](https://clarionhub.com/u/anon23294430)\
**Post date:** [June 1, 2022, 2:28pm UTC](https://clarionhub.com/t/help-visual-project-modernize-the-software-visually/5170/2 "2022-06-01T14:28:14Z")

</div>

Have you seen this post?  
[ButtonTiles Class - code / Snippets - ClarionHub](https://clarionhub.com/t/buttontiles-class/474/13)

So most of the buttons tend to have images on them, sometimes gifs which react when the mouse hovers over the button.

There might be something in the clarionmag website  
[Clarion Content - Confluence (jira.com)](https://clarionmag.jira.com/wiki/spaces/clarion/overview?homepageId=399600)

You can use an addon like this  
[Codejock – noyantis](https://noyantis.com/product-category/codejock/)

There is XAML  
[Microsoft’s Xaml Islands used in a Clarion app. This allows “modern” UWP Windows controls to be used in a Win32 app - ide / Customization - ClarionHub](https://clarionhub.com/t/microsoft-s-xaml-islands-used-in-a-clarion-app-this-allows-modern-uwp-windows-controls-to-be-used-in-a-win32-app/4676)

You might find something on Github  
[Search · language:clarion · GitHub](https://github.com/search?q=language%3Aclarion)

You can add image files onto the button and obviously resize the button to match the image size, and you can make them flat and do other things, so it should be possible to get the UI you want fwiw.

HTH

---

<div class="post-metadata">

**Author:** ![jslarve](https://clarionhub.com/letter_avatar_proxy/v4/letter/j/e480ec/32.png) [@jslarve](https://clarionhub.com/u/jslarve)\
**Post date:** [June 1, 2022, 10:12pm UTC](https://clarionhub.com/t/help-visual-project-modernize-the-software-visually/5170/3 "2022-06-01T22:12:04Z")

</div>

There’s so much stuff on that window. Considering that, I think you could spend a lot of time futzing around with it. Then you might decide to leave it mostly the way it was, or else rewrite the whole thing.

Personally, I don’t think the icons look bad or outdated. Perhaps some font changes.  
Some spacing cleanup.

Does it resize well?

---

<div class="post-metadata">

**Author:** ![Rudik](https://clarionhub.com/letter_avatar_proxy/v4/letter/r/439d5e/32.png) [@Rudik](https://clarionhub.com/u/Rudik)\
**Post date:** [June 2, 2022, 9:51am UTC](https://clarionhub.com/t/help-visual-project-modernize-the-software-visually/5170/4 "2022-06-02T09:51:54Z")

</div>

Buy a nice Icon-Set! I recomend this on from Axialis…

> **[Axialis Special Offers](https://www.axialis.com/promotions/)**
>
> Our product special offers are available here.

they also offer the probably best Icon-Editor

---

<div class="post-metadata">

**Author:** ![donridley](https://clarionhub.com/user_avatar/clarionhub.com/donridley/32/1459_2.png) [@donridley](https://clarionhub.com/u/donridley)\
**Post date:** [June 2, 2022, 11:34am UTC](https://clarionhub.com/t/help-visual-project-modernize-the-software-visually/5170/5 "2022-06-02T11:34:23Z")

</div>

Hello Julian!

Welcome to ClarionHub! Glad to have you here.

You didn’t mention which version of Clarion you’re using but, if possible, the first thing to try is adding a Manifest to the project. It will automatically apply the OS theme to a lot of the controls.

Also, there is Capesoft’s Makeover product:

[https://www.capesoft.com/accessories/makesp.htm](https://www.capesoft.com/accessories/makesp.htm)

Rich made some good suggestions as well.

Noyantis has several products that can add more modern controls to Clarion applications.

For example, their SkinFramework product can change the look of window frames and numerous controls as well.

[https://noyantis.com/product/skinframework/](https://noyantis.com/product/skinframework/)

 ![SkinFramework](https://clarionhub-uploads.s3.eu-north-1.amazonaws.com/original/2X/0/0af4c79b520161fa980903fa1a520cd444300fef.jpeg)

Good luck and I hope this information helps.

Don

---

<div class="post-metadata">

**Author:** ![CarlBarnes](https://clarionhub.com/user_avatar/clarionhub.com/carlbarnes/32/1859_2.png) [@CarlBarnes](https://clarionhub.com/u/CarlBarnes)\
**Post date:** [June 2, 2022, 5:42pm UTC](https://clarionhub.com/t/help-visual-project-modernize-the-software-visually/5170/6 "2022-06-02T17:42:55Z")

</div>

I’ll paste the window in this post. The OP attached it so it must be downloaded

 ![image](https://clarionhub-uploads.s3.eu-north-1.amazonaws.com/original/2X/3/30d02a0ce585c877434c58df4a44c42da17a9d5a.png)

---

<div class="post-metadata">

**Author:** ![CarlBarnes](https://clarionhub.com/user_avatar/clarionhub.com/carlbarnes/32/1859_2.png) [@CarlBarnes](https://clarionhub.com/u/CarlBarnes)\
**Post date:** [June 2, 2022, 5:46pm UTC](https://clarionhub.com/t/help-visual-project-modernize-the-software-visually/5170/7 "2022-06-02T17:46:42Z")

</div>

> [@jslarve](#):
>
> There’s so much stuff on that window. Considering that, I think you could spend a lot of time futzing around with it.

There are some Controls with very tight spacing. Many have small misalignments that can be distracting. The Window Designer is not accurate for stuff that tight. I have my Window Preview class that allows adjusting on a Preview Window or the live window. This way it is perfect. Then you do have to transfer the numbers back into the Designer.

> **[GitHub - CarlTBarnes/WindowPreview: Generated Window Preview has secret button allows...](https://github.com/CarlTBarnes/WindowPreview)**
>
> Generated Window Preview has secret button allows Unhide controls, PROP Reflection, Resize controls, LISTPROP view and Reformat. Class allows same in live application on any window.

> [@List Format Parser - Split Columns into Lines for View, Edit, Compare also List Previewer](https://clarionhub.com/t/list-format-parser-split-columns-into-lines-for-view-edit-compare-also-list-previewer/3991/6):
>
> Thank you! You are talking about my [Window Preview Class](https://github.com/CarlTBarnes/WindowPreview) that was also shown in #604. I use it so much I wonder how I lived without it. The name is kind of confusing. It originally was just for Window Preview but then I realized it would be useful at runtime on a “live” window. I’m thinking of renaming it “Window 411 Class” as in 411 = Slag for Information. In presentations I can use other hip slag like “let’s use Window 411 to give you the Low Down on this List Control”

[[https://www.youtube.com/watch?v=YdF\_G1CWvEA](https://www.youtube.com/watch?v=YdF_G1CWvEA)]([https://ClarionLive](https://ClarionLive) Webinar Episode 562 Live Window WYSIWYG Design and PROPs Reflection)

---

<div class="post-metadata">

**Author:** ![BoxSoft](https://clarionhub.com/letter_avatar_proxy/v4/letter/b/3d9bf3/32.png) [@BoxSoft](https://clarionhub.com/u/BoxSoft)\
**Post date:** [June 3, 2022, 1:26pm UTC](https://clarionhub.com/t/help-visual-project-modernize-the-software-visually/5170/8 "2022-06-03T13:26:32Z")

</div>

- Changing the icons would be a big difference.
- Use a more modern font, like Segoe UI.
- Use a simpler tab style, without those angles.
- Remove the color from the fonts, and rely on the bolding to make them stand out. If that’s not enough, then use a different font to make things like the group headers more noticeable.

---

<div class="post-metadata">

**Author:** ![julian\_agile](https://clarionhub.com/user_avatar/clarionhub.com/julian_agile/32/3145_2.png) [@julian\_agile](https://clarionhub.com/u/julian_agile)\
**Post date:** [June 23, 2022, 10:00am UTC](https://clarionhub.com/t/help-visual-project-modernize-the-software-visually/5170/9 "2022-06-23T10:00:21Z")

</div>

Thanks you very much, I will try to see that.  
🙂

---

<div class="post-metadata">

**Author:** ![richk](https://clarionhub.com/user_avatar/clarionhub.com/richk/32/1476_2.png) [@richk](https://clarionhub.com/u/richk)\
**Post date:** [June 23, 2022, 4:40pm UTC](https://clarionhub.com/t/help-visual-project-modernize-the-software-visually/5170/10 "2022-06-23T16:40:15Z")

</div>

I’ve been running JAL FinalStep for the past 10+ years and it makes screens attractive and seems to be bulletproof. My Users are also very happy with it.

[https://clariontemplates.com/FinalStep\_e.html](https://clariontemplates.com/FinalStep_e.html)
