Hi everyone, this is our second iteration of machine designed website templates. Currently we're only generating WordPress themes, but we're also testing static & Drupal templates for a given design.
Our goal is to do creative visual design using machine learning and AI algorithms and to provide diverse creative elements with minimal configuration or customization.
It's a bit hard to separate sample content from theme characteristics, and we're aware we must show fancier preview content.
Anyway, I appreciate any feedback on what we're doing, what we've done, and what we could do better.
Initially we made a statistical analysis of 10K web sites on particular design choices such as layout, color scheme snd colors, fonts, decorational elements. We also made a rating review with 500 people to judge themes with some ratings... Then we backpropagate the ratings to suppress some parameters and produce newer themes with more of the good ones..
From what I've seen, it looks like it's not quite working. As far as I can tell, it takes a range of numbers, picks something random in between, and calls it a day. Most of those themes that I saw make me want to hire a designer because they look like something I could do myself (and I am awful at design).
I think the issue is that your machine learning doesn't seem to know what goes together and what doesn't. It may focus in on a small subset, but then it mixes and matches elements that don't go together. Like it's not seeing the whole picture, more it's taking certain elements from 'good pages' and jumbling them all up. If it randomly produces a good design, how are you sure that it's not an exact copy of one of the training designs?
The integration algorithm merges orthogonal dimensions based on human feedback. For example, a monotonic color scheme with 3 columnar layout, flat design and no borders could be a few of the orthogonal parameters. Final feedback comes from humans, and I guess that ll ensure an overall harmonic result.
With newer iterations and more feedback it's getting better indeed.
>Do you think it's something a non-designer could do?
Picking an ugly font that has to be huge to be legible and providing too much empty space and padding? Yea, I can do that.
That particular case, the colors make the text not so hard on the eyes, but the font itself is just awful at that size, it may be interesting in print, but on a webpage it's just too jumbled and it's certainly not very legible. You wouldn't want to read a book written in that font.
Click on the 'features' or 'bootstrap' on that page, and tell me you don't spot something wrong.
Also, where does the magenta color come in? I see it nowhere in that theme...
I think it's great that you are working on making something like this, I'd love to tell my computer 'give me something gloomy' and then 'but not too dark' and it would generate and iterate until it got something I liked. I just don't think it's quite ready for primetime. Unless of course you are just looking for feedback on the themes. In that case, I'd suggest you open up the comments on each theme page and allow rating anonymously.
Here are some thoughts based on my experience with graphic design (not so much web design.)
First, you might find it interesting to look into Shape Grammars. While shape grammars are a dead end from a creative design point of view, they can capture layout strategies that work but can be varied parametrically. One crucial area that the theme you posted falls down on is balancing negative space around images and panels. Using a shape grammar which constructed the layout with border elements, centered elements, etc. could fix this.
Another thought is to consider the fact that letterpress printing is often taught to design students before computer tools, because it enforces a great degree of discipline in laying out elements. Students move on from that to design with a grid system. The theme "abdvbjtx" on the resimit front page as I look at it is missing a sense of alignment and grid structure, although it is impressively complex in terms of layering. The typographic and rational side of things needs work, basically to bring visual order to all the elements. I think some kind of generative grammar is probably the only practical way to achieve this.
As far as typeface choice goes, that seems to be a weak point but it is such a complex and emotional thing that I doubt it can be automated beyond specifying serif fonts for old-style centered layouts and sans serif for more modern, left-aligned layouts.
When you say 'machine designed' I imagine a designer going through and intelligently choosing colors, photos, font sizes and dimensions because they went to school, they know what looks good, they have a good education. What designers have worked in your toolkit to produce these, and where did you learn design? If this is intelligently designed, I would like to know more about the process. From what I can see, I understand why designers get the money that they do.
I responded to a sister comment with more details. By machine, i mean machine learning algorithms... Yes i agree that hiring a good designer might produce excellent designs.. That's our challenge, to iterate till we pass a point of neat, elegant designs..
They are terrible! which is good because that means I'm not getting obsolete anytime soon. On the other hand, I'd love to see this AI get better and make me obsolete. How are you training it?
19 comments
[ 3.1 ms ] story [ 49.8 ms ] threadOur goal is to do creative visual design using machine learning and AI algorithms and to provide diverse creative elements with minimal configuration or customization.
It's a bit hard to separate sample content from theme characteristics, and we're aware we must show fancier preview content.
Anyway, I appreciate any feedback on what we're doing, what we've done, and what we could do better.
I think the issue is that your machine learning doesn't seem to know what goes together and what doesn't. It may focus in on a small subset, but then it mixes and matches elements that don't go together. Like it's not seeing the whole picture, more it's taking certain elements from 'good pages' and jumbling them all up. If it randomly produces a good design, how are you sure that it's not an exact copy of one of the training designs?
The integration algorithm merges orthogonal dimensions based on human feedback. For example, a monotonic color scheme with 3 columnar layout, flat design and no borders could be a few of the orthogonal parameters. Final feedback comes from humans, and I guess that ll ensure an overall harmonic result.
With newer iterations and more feedback it's getting better indeed.
Edit: I appreciate your critical thinking.
Picking an ugly font that has to be huge to be legible and providing too much empty space and padding? Yea, I can do that.
That particular case, the colors make the text not so hard on the eyes, but the font itself is just awful at that size, it may be interesting in print, but on a webpage it's just too jumbled and it's certainly not very legible. You wouldn't want to read a book written in that font.
Click on the 'features' or 'bootstrap' on that page, and tell me you don't spot something wrong.
Also, where does the magenta color come in? I see it nowhere in that theme...
I think it's great that you are working on making something like this, I'd love to tell my computer 'give me something gloomy' and then 'but not too dark' and it would generate and iterate until it got something I liked. I just don't think it's quite ready for primetime. Unless of course you are just looking for feedback on the themes. In that case, I'd suggest you open up the comments on each theme page and allow rating anonymously.
First, you might find it interesting to look into Shape Grammars. While shape grammars are a dead end from a creative design point of view, they can capture layout strategies that work but can be varied parametrically. One crucial area that the theme you posted falls down on is balancing negative space around images and panels. Using a shape grammar which constructed the layout with border elements, centered elements, etc. could fix this.
Another thought is to consider the fact that letterpress printing is often taught to design students before computer tools, because it enforces a great degree of discipline in laying out elements. Students move on from that to design with a grid system. The theme "abdvbjtx" on the resimit front page as I look at it is missing a sense of alignment and grid structure, although it is impressively complex in terms of layering. The typographic and rational side of things needs work, basically to bring visual order to all the elements. I think some kind of generative grammar is probably the only practical way to achieve this.
As far as typeface choice goes, that seems to be a weak point but it is such a complex and emotional thing that I doubt it can be automated beyond specifying serif fonts for old-style centered layouts and sans serif for more modern, left-aligned layouts.
The interplay between elements is just as important as the individual elements themselves. Basically, context is super important.
http://www.awwwards.com/