# UIBUILDER v6.6 beta progress: New landing page for the docs - feedback wanted

**URL:** <https://discourse.nodered.org/t/uibuilder-v6-6-beta-progress-new-landing-page-for-the-docs-feedback-wanted/81427>\
**Category:** Share Your Nodes\
**Tags:** uibuilder\
**Created:** [18 September 2023 19:37 UTC](https://discourse.nodered.org/t/uibuilder-v6-6-beta-progress-new-landing-page-for-the-docs-feedback-wanted/81427 "2023-09-18T19:37:14Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [18 September 2023 19:37 UTC](https://discourse.nodered.org/t/uibuilder-v6-6-beta-progress-new-landing-page-for-the-docs-feedback-wanted/81427/1 "2023-09-18T19:37:14Z")

</div>

Hi all,

In a fit of "creativity" (:cough:), I decided that the landing page for the docs needed a bit of snazing up.

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/a/8/a8393a9b1a46cfce997e9b06594d868312b0b0d1.jpeg)

It has been pushed to the v6.6.0 branch so you can play with it if you like.

Still a bit boring basic though so I'm looking for some ideas to help make it look even better. Sticking within the current overall style colour scheme though unless you fancy doing us a complete makeover!

Note that the previous homepage is still there, just scroll down or click on the "Get Started" button. The "Quick Start" button takes you to the example walkthough tutorial.

---

<div class="post-metadata">

**Author:** ![Paul-Reed](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/paul-reed/32/66906_2.png) [@Paul-Reed](https://discourse.nodered.org/u/Paul-Reed)\
**Post date:** [18 September 2023 20:09 UTC](https://discourse.nodered.org/t/uibuilder-v6-6-beta-progress-new-landing-page-for-the-docs-feedback-wanted/81427/2 "2023-09-18T20:09:58Z")

</div>

IMO the blue logo looks out of place, and the overall page would look more balanced without it.

I like your choice of typeface & colours 👍

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [18 September 2023 20:27 UTC](https://discourse.nodered.org/t/uibuilder-v6-6-beta-progress-new-landing-page-for-the-docs-feedback-wanted/81427/3 "2023-09-18T20:27:32Z")

</div>

Yes, I know what you mean. Actually, the uibuilder logo started as a bit of an in-joke being an IBM blue version of the Node-RED logo.

Maybe we need a new logo - any designers out there?

---

<div class="post-metadata">

**Author:** ![Paul-Reed](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/paul-reed/32/66906_2.png) [@Paul-Reed](https://discourse.nodered.org/u/Paul-Reed)\
**Post date:** [18 September 2023 21:13 UTC](https://discourse.nodered.org/t/uibuilder-v6-6-beta-progress-new-landing-page-for-the-docs-feedback-wanted/81427/4 "2023-09-18T21:13:08Z")

</div>

You could consider changing the word uibuilder into your logo... maybe increasing the weight & the colour of the first 2 letters to 8f0000 ?

 ![jules1](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/8/0/805c68b5d4bf444a36a1f731887edeb98224f712.jpeg)

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [18 September 2023 22:18 UTC](https://discourse.nodered.org/t/uibuilder-v6-6-beta-progress-new-landing-page-for-the-docs-feedback-wanted/81427/5 "2023-09-18T22:18:42Z")

</div>

> [@Paul-Reed](#):
>
> 8f0000

Need to find the right lightness and need to thicken the `ui` part.

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/9/c/9c1462d433f0be0319245efc65ec7de07407dfc0.png)

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/4/5/45a4cd3267c07fb60cc305ccb553a20bb2bde991.png)

That second looks better to me, at least on a darker background. `hsl(0 100% 50% / 50%)`

I'd still like an actual graphical logo though.

---

<div class="post-metadata">

**Author:** ![Paul-Reed](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/paul-reed/32/66906_2.png) [@Paul-Reed](https://discourse.nodered.org/u/Paul-Reed)\
**Post date:** [19 September 2023 08:06 UTC](https://discourse.nodered.org/t/uibuilder-v6-6-beta-progress-new-landing-page-for-the-docs-feedback-wanted/81427/6 "2023-09-19T08:06:04Z")

</div>

> [@TotallyInformation](#):
>
> That second looks better to me,

I suggested 8f0000 because it's node-RED red, but yes, the second red looks OK and subtly contrasts the background.

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [19 September 2023 08:47 UTC](https://discourse.nodered.org/t/uibuilder-v6-6-beta-progress-new-landing-page-for-the-docs-feedback-wanted/81427/7 "2023-09-19T08:47:33Z")

</div>

Looks OK in light mode too I think

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/c/e/ce82b9ff5012ecf3da5ac2a2ad30ba3bb548590e.png)

Testing if Discourse supports the highlighting:

# uibuilder v6

for Node-RED

Hmm, sadly not.

I may try changing the blue in the logo to something lighter and in keeping with the rest of that scheme - just to see if that works.

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [19 September 2023 09:08 UTC](https://discourse.nodered.org/t/uibuilder-v6-6-beta-progress-new-landing-page-for-the-docs-feedback-wanted/81427/8 "2023-09-19T09:08:43Z")

</div>

How's this:

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/6/f/6fb2632fd12d180a8c5181684f1e720d7534fee0.jpeg)

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/d/f/dfe56d7529ae92d1a96a8b6d0205b83217822c24.jpeg)

---

<div class="post-metadata">

**Author:** ![zenofmud](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/zenofmud/32/316_2.png) [@zenofmud](https://discourse.nodered.org/u/zenofmud)\
**Post date:** [19 September 2023 09:19 UTC](https://discourse.nodered.org/t/uibuilder-v6-6-beta-progress-new-landing-page-for-the-docs-feedback-wanted/81427/9 "2023-09-19T09:19:27Z")

</div>

Oh...I LIKE the lighter background!

---

<div class="post-metadata">

**Author:** ![fmarzocca](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/fmarzocca/32/35901_2.png) [@fmarzocca](https://discourse.nodered.org/u/fmarzocca)\
**Post date:** [19 September 2023 09:27 UTC](https://discourse.nodered.org/t/uibuilder-v6-6-beta-progress-new-landing-page-for-the-docs-feedback-wanted/81427/10 "2023-09-19T09:27:24Z")

</div>

me too!....!

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [19 September 2023 09:30 UTC](https://discourse.nodered.org/t/uibuilder-v6-6-beta-progress-new-landing-page-for-the-docs-feedback-wanted/81427/11 "2023-09-19T09:30:02Z")

</div>

Actually, that has always been there in the docs. You can flip between light and dark modes.

But yes, the icon is a much better colour now. I've also changed the favicon as well. 🙂

Pushed to GitHub right now.

OK, off to visit a front-line hospital trust so I'd better get going.

---

<div class="post-metadata">

**Author:** ![E1cid](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/e1cid/32/77971_2.png) [@E1cid](https://discourse.nodered.org/u/E1cid)\
**Post date:** [19 September 2023 10:58 UTC](https://discourse.nodered.org/t/uibuilder-v6-6-beta-progress-new-landing-page-for-the-docs-feedback-wanted/81427/12 "2023-09-19T10:58:42Z")

</div>

I think would look OK if icon was same size as uibuiler text and before the u. Disclaimer, I am not or have never been a graphic artist.

---

<div class="post-metadata">

**Author:** ![marcus-j-davies](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/marcus-j-davies/32/103435_2.png) [@marcus-j-davies](https://discourse.nodered.org/u/marcus-j-davies)\
**Post date:** [19 September 2023 17:14 UTC](https://discourse.nodered.org/t/uibuilder-v6-6-beta-progress-new-landing-page-for-the-docs-feedback-wanted/81427/13 "2023-09-19T17:14:01Z")

</div>

I want a go 😂 (I do enjoy rendering in 3D) - so this is up my street (as in my likes, not skill)

 ![Untitled](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/6/9/6909245b7df643c7bb585b41678576404bbfa830.png)

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [20 September 2023 14:29 UTC](https://discourse.nodered.org/t/uibuilder-v6-6-beta-progress-new-landing-page-for-the-docs-feedback-wanted/81427/14 "2023-09-20T14:29:30Z")

</div>

Interesting. Some nice things there. Not having _everything_ centred, I was thinking about that.

However ... 😁 ...

I don't like the white backdrop I'm afraid. And I'd like the strapline to stand out a bit more.

I may have a go to see if the ghosted backdrop versions of the logo can be incorporated in the existing background. I think the Node-RED part looks better so that will get incorporated. And I do tend to prefer bullets on the list. However, I may play with putting them in boxes instead to see how that looks. Be nice to get icons for each of the bullets but I'm not sure I'm up to that.

Thanks for taking part and contributing!

---

<div class="post-metadata">

**Author:** ![marcus-j-davies](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/marcus-j-davies/32/103435_2.png) [@marcus-j-davies](https://discourse.nodered.org/u/marcus-j-davies)\
**Post date:** [20 September 2023 16:44 UTC](https://discourse.nodered.org/t/uibuilder-v6-6-beta-progress-new-landing-page-for-the-docs-feedback-wanted/81427/15 "2023-09-20T16:44:39Z")

</div>

> [@TotallyInformation](#):
>
> Be nice to get icons for each of the bullets but I'm not sure I'm up to that

Just because I like this sort of thing, here is some inspiration 😁

![Code](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/e/9/e928013596796dee4a563e9b881e484b6e61b3d9.png) ![Data](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/c/c/cce3f4fa53223b4f39b80b40f5ff35a8f33dc30f.png) ![Framework](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/e/5/e5a51bdd54ba75630c701b66d385aed634eeeb88.png) ![Wokrflow](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/c/d/cd824ecf78aa07088594b6456081f6dc1540356f.png)

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [20 September 2023 16:46 UTC](https://discourse.nodered.org/t/uibuilder-v6-6-beta-progress-new-landing-page-for-the-docs-feedback-wanted/81427/16 "2023-09-20T16:46:28Z")

</div>

Ohh! Nice. Don't suppose those are SVG's are they? If you are happy for me to use them, I'll give them a go - might change the blue to the new lighter blue though if that's OK?

I'll be honest and say that I was somewhat prompted by FlowForge's Dashboard 2 homepage. 😉 But I like the sketch style you've used here.

Just back from a 2-day away architecture session at a specialist hospital so fairly tired tonight but will certainly be looking to incorporate the inspirations.

---

<div class="post-metadata">

**Author:** ![marcus-j-davies](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/marcus-j-davies/32/103435_2.png) [@marcus-j-davies](https://discourse.nodered.org/u/marcus-j-davies)\
**Post date:** [20 September 2023 16:50 UTC](https://discourse.nodered.org/t/uibuilder-v6-6-beta-progress-new-landing-page-for-the-docs-feedback-wanted/81427/17 "2023-09-20T16:50:55Z")

</div>

Im not going to take credit 👼

I used your blue box, with icons from here (data exchange icon example)

I just Inverted them so they become white  
MIT License

> **[Exchange - User Interface & Gesture Icons](https://icon-icons.com/icon/exchange/151372)**
>
> ExchangeIcon in Tabler icons ✓ Find the perfect icon for Your Project and download them in SVG, PNG, ICO or ICNS, its Free!

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [20 September 2023 16:52 UTC](https://discourse.nodered.org/t/uibuilder-v6-6-beta-progress-new-landing-page-for-the-docs-feedback-wanted/81427/18 "2023-09-20T16:52:43Z")

</div>

Super. And they have SVG versions which is nice. Especially as those can be used inside the Editor too.

And don't put yourself down, you found some and that is a great contribution. 😁

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [24 September 2023 19:31 UTC](https://discourse.nodered.org/t/uibuilder-v6-6-beta-progress-new-landing-page-for-the-docs-feedback-wanted/81427/19 "2023-09-24T19:31:31Z")

</div>

OK, so I may have gone a little overboard on the branding! 🥴

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/8/4/84c6d1833a1e1274e2983d3566bf9d6d23f31622.png)

From here-on out, what was the all lower-case "uibuilder" becomes the all upper case "UIBUILDER" with the red "UI" and the blue "BUILDER".

It will appear as lower case still when referring to one of the technical aspects, e.g. "`uibuilder` node".

---

<div class="post-metadata">

**Author:** ![Paul-Reed](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/paul-reed/32/66906_2.png) [@Paul-Reed](https://discourse.nodered.org/u/Paul-Reed)\
**Post date:** [24 September 2023 19:59 UTC](https://discourse.nodered.org/t/uibuilder-v6-6-beta-progress-new-landing-page-for-the-docs-feedback-wanted/81427/20 "2023-09-24T19:59:38Z")

</div>

Just a thought Julian... but if you are wanting user's opinion about the logo, upper/lower case etc, have you considered using a poll?

_Poll ([view on site](https://discourse.nodered.org/t/uibuilder-v6-6-beta-progress-new-landing-page-for-the-docs-feedback-wanted/81427/20))_

[Next page](https://discourse.nodered.org/t/uibuilder-v6-6-beta-progress-new-landing-page-for-the-docs-feedback-wanted/81427.md?page=2)