Design and Concept

[TobiGr]

Follow up of #10.

---

@theScrabi @TheAssassin This needs some improvements, but overall, what do you think of the concept?
We could then also remove the slides Lightweight, Open Source and Price/Free and add them as separate tiles below / above multiple services.

main page desktop

[TheAssassin]

I would move the downloads to the bottom of the page, even below the "user voices" slideshow thing. That causes "potential customers" to actually read the website.

[TobiGr]

Yeah, sounds reasonable.
I think we will need a different navigation bar for this "one-pager" too. Maybe something fixed to the right side of the page containing icons which expand to texts when you hover them. I could also imagine a "second" nav bar that fades in when the header isn't visible anymore.

[TheAssassin]

The page isn't long enough to need a navbar for vertical navigation in my opinion.

[TobiGr]

Here are two screenshots I'd like to share with you.

mobile version
desktop version

I won't add the multi services tiles to the next PR because some I do not have a good idea what to put in them :) My idea is to add them after 1.0 is released.
I have not read the c't articles about NewPipe. If someone of you did it, can you tell me whether there is anything that I can place in the "user voices" section?

[TheAssassin]

Looks awesome! Great job, @TobiGr.

There's just a little issue with the word "OpenSource"... actually, it's "open-source" or "open source". But I'm sure @theScrabi would prefer "free software", "free and open source software" or "FLOSS" a.k.a. "free/libre open source software". I'd go for "free software", as it's the shortest option. It'd be great if you could fix that. Also, on the bottom of the page, there's some lowercase "buzzwords", whose casing should probably be fixed.

[theScrabi]

"free and open source software" was god i think.
However the pannels for each service, what would you like to put into these?

[TobiGr]

"free and open source software" was god i think.

Can I skip the "software"?

Also, on the bottom of the page, there's some lowercase "buzzwords", whose casing should probably be fixed.

@TheAssassin Do you mean the footer?

[TheAssassin]

"bring NewPipe forward" and "support our developers".

[TobiGr]

What would you like to change there? I think it is good to have lowercase words at the beginning and end. Both are not "complete" sentences and it looks good the way it is right now.
And which words would you like to highlight?

[TheAssassin]

I would change the first words' casing to uppercase nevertheless. It's a style thing: these are not complete sentences, but they're independent "fragments", therefore it makes sense to have a "sentence-like" start. Imagine there was an exclamation mark in the end of these fragments, then they're imperative form sentences.

[TheAssassin]

Re. highlight: I have no idea where you picked that up.

[TobiGr]

I have changed this now, but it feels like the uppercase words draw the attention more to the words itself instead of the donate button.
That's what I meant with "highlight".

[TheAssassin]

I don't think that's the case. @theScrabi I guess we need a third opinion.

[theScrabi]

I don't think this is so important, however I like it lowercase, I guess its more symmetric.

[TobiGr]

@TheAssassin @theScrabi We need a new footer to include the privacy link. Just adding it to the list looked strange.
That's what I've got. Do you have any other suggestions?

[theScrabi]

It does not, I kind of like it. @TheAssassin what do you say?

[TheAssassin]

I think it's okay, too. But if you want to, we could combine both Licensing and Privacy Policy to a Legal button, and create a Legal page linking to such documents. Then future pages can just be added to that page.

[TobiGr]

@TheAssassin That sounds like a good idea. I'm in Berlin for a couple of days. Await my PR within the next week.

[TheAssassin]

Thanks. And have fun in Berlin!

[theScrabi]

Visit C-Base near Alex or the ccc hacerspace if you are there :D

[TobiGr]

Our blog looks like 💩 atm.

I won't have time to implement this now, but I made some quick drafts for a lighter and more user-friendly design. I tried to stick to the tiles like layout we use on the other sites.

@TheAssassin @theScrabi @ponypower Any ideas/thoughts on this?

blog main page
blog post page

[TheAssassin]

Generally looks good to me. I like the new style much more than the current one.

The mix of shadow for nav/bottom bar and no shadow for the main element is a bit inconsistent (half flat, half "3D"). I think it might be nice to introduce a little shadow for the main element, too, or just drop all shadows like on the second picture (flat designs are still more popular than shadowed ones, aren't they)?

I'll have a closer look in #111 and will add more comments there.

[TobiGr]

I just took the working website and modified it in the browser. So yes, this design isn't finished yet and still needs to be implemented properly. E.g. I didn't take a look at the correct container width and heights, shadows, etc. I just removed things when I came across them. I guess, I'll remove the shadows completely.

[TheAssassin]

Ah, okay. I already saw that this wasn't implemented in #111 yet, but my assumption was it wasn't committed yet. Looking forward to it!

[TobiGr]

Btw. what do you think of creating thumbnails with the current NewPipe version? We used the same thumbnail for a dozen posts. The new thumbnails could be in the style of the old NewPipe beta icon, but insteat of the "BETA" we can insert the version number. This could be done for the old posts as well without much effort. Another advantage: when linking the posts on "social" media or other platforms, the preview thumbnail would be more meaningful.
Take a look at the 0.15.1 post thumbnail to see what I mean.