Could you export some larger mockup images? It’s hard to critique these effectively.
@all another update on the project: I’ve finished some basic redesigns of Natron’s website (or at least the homepage anyway). Here they are:
The two versions are mostly identical, except for a minor difference in alignment. I personally prefer the first version. Tell me which one you guys find better-looking.
In time, I’m planning to turn my designs into a full webpage with fullPage.js. If anyone is interested, head to my Natron design repo to help out and improve the design.
In time, I’m planning to turn my designs into a full webpage with
fullPage.js
Natron’s website is hosted on GitHub Pages, using Jekyll is probably preferred.
I gave this a shot over at Natron a while ago but frankly there’s a lot I’d do differently here.
@Shrinks99 Yeah, I didn’t consider that. I’ll see what I can do with Jekyll, maybe a minimalist design aesthetic, but the other project seems to have much more effort and time put into it. I might make a fork of that project and make it something that’s similar to this. Alternatively, I might turn the mockups into a sort of splash screen for Natron.
Go for it! I think the website is a much bigger priority for design updates than the application at the moment. Code is available here. Readme is a bit out of date.
All you need to do is adapt the graphics/style to the existing template at https://wilkinson.graphics/NatronGitHub.github.io, should be trivial… The rest of the (new) site just needs minor adjustment (IMHO).
Yo, the website design looks really dope!
Context looks neat. Have you figured out the text or are you gonna just copy paste from the old site?
@El_Artista @Shrinks99 I’ve made full mockups of my designs for Natron’s website.
The first is based on the existing template at https://wilkinson.graphics/NatronGitHub.github.io and attempts to respect most of the original’s design philosophy while improving the overall UX. This should work very well with jekyll and Github Pages and load very quickly. Note that this design looks best if you view the video in full screen, or otherwise it might look cut-off.
Here it is:
And the second is my personal take on Natron’s website, with a higher emphasis on showcasing Natron renders (please excuse the hypocrisy of using Blender-rendered images for this). This means lots of overlays, smooth scrolling, and high-definition images. It might look cooler, but the load time is going to suffer if anything like this is implemented:
Overall, I’m pretty pleased with the results, seeing that I practically rushed through them. Please tell me what you guys think.
1 Like
Looks pretty good.
A little bit of finessing would be great. I can’t look into it in detail right now because to be honest I’m feeling very depressed lately and I’d like to manage that first. But I’ll try to help with small things if its needed.
The only thing that feels redundant is the support/fund button because after many discussions about it nobody thinks its going to happen. I dont think we need to bring that topic up again because it always reaches the same conclusions:
We dont have an entity which can receive and collect the funds.
We dont have anybody who can utilize those funds (full time maintainers/developers).
We (mostly) dont have anybody who will be willing to donate much (looking at things historically).
Personally I’d love to do a recurring monthly donation to Natron development but point 1 and 2 makes it not so possible, because there’s nowhere for the money to go to and nobody to utilise the money even if it went in some collection box. Even if I’m donating money, I’d like to see some ROI which is hard unless we have at least one full time maintainer.
1 Like
@El_Artista I agree that the donate button could be removed until Natron can actually get full-time developers. Some modifications are definitely needed, though the school year will make the process very slow. I would appreciate any help, but I’m content to do it independently if neccessary. And please take care.
1 Like
I can’t help with any kind of coding work, I have really forgotten it. The last time I built a website was in 2016.
I can help with graphics and visual aspects.
@El_Artista Thanks a lot. I’ve put together another, more polished landing page (the other pages are still WIP). Here it is:
Goals for the near future (see if there’s something you’re interested in):
- Work on implementing a consistent color scheme. (I’m using nord colors for now, might change in the future)
- Making a style guide (e.g. standard font size and tracking, grids, components)
- Preferably replace the VFX shot in the mockup to something that is actually made in Natron (I’d appreciate it if you can provide any renders)
- Outreach and UI/UX feeback (getting more designers onboard, creating surveys to rate designs)
- Documentation and collaboration (proper style guide, and collaborative design w/ Github)
- Prototyping/Animations
1 Like
Looks good to me (the official logo is preferred).
1 Like
Okay, I’ll change it to the official logo.
That’s not the official logo… 
Layout looks pretty good though! I may submit some minor typographical adjustments at some point when code is being worked on. I think I’d go for a bolder typeface for the logotype, Natron doesn’t have a brand style guide and that is definitely worth investing some design time into. The gradient fill is much better than the previously jarring diagonal slash, though it may need to be adjusted vertically for mobile. Overall big improvement over the hero section I made before. 
We absolutely need more made in Natron renders! Happy to make closeups of these ones available.
In terms of a roadmap I’d propose a branding & website overhaul → a new splash screen (low amount of effort vs payoff and a nice place to start extending any new branding into the application) → start looking at Natron’s QT theming and figuring out what areas to overhaul. There are plenty of small UX problems (see my posts above) but as @rodlie has pointed out, a lot of the worst parts of the UI can actually be solved with relatively minor theme overhauls, not even touching the application’s layout. Personally the biggest UX issues I have with Natron are node-graph related but those require actual programming effort to solve (snapping with multiple nodes selected anyone? 
).
I’ll be able to commit some time to this during my winter time off starting mid December, happy to help with Jekyll, website prototyping & HTML/SCSS during that time.
Sure, any help with the project would be great. You can find and download the Inkscape SVG files for my design here - just note that you need the font Inter installed to display it properly. In terms of creating a mobile-friendly design, I suggest you visit npmjs’s website which also uses a complex gradient background on its front page.
