Hey Sven!

You were invited :) At some screens I added comments. Make sure to read them and feel free to create your own if there are open questions.

At the "PL - Icons" screen you can download the icons as SVG. The 2 big background images as well as the IPFire Tux can be downloaded from here: https://www.dropbox.com/sh/1j3p4f3igjxk2u8/AADDwHKvFIOtOC92EyYR8DJja/Website/Export?dl=0
I'm aware that the filesize of Tux is a bit high. But we need him bigger for Hi-Res/Retina Screens. When I throw him though compressor.io I get pixelated flames as output :(

At the Styleguide tab you can grap all the used colors. Perhaps it doesn't make sense to put the rbga colors inside the global color palette. I had to name them because these are single colors for Zeplin.

As discussed earlier - I used a 24px gap for the grid for every viewport. I didn't touch anything else. Within the shared Dropbox folder you find PNGs of all 5 key-viewports with the grid as an overlay.

Let me know if you have any concerns or questions. 


--

@Michael

What should I do next? Bring the Captive Portal into Zeplin or the already designed Feature page of the IPFire Website?

--

@All

All designs which are located in the Zeplin project are also available here as PNGs:
https://www.dropbox.com/sh/1j3p4f3igjxk2u8/AAAmebh2c1ay1t-z4UKrsWBAa?dl=0


Best,
Maurice

On Mon, Mar 27, 2017 at 7:31 AM, Sven <sven.hoehn@posteo.de> wrote:
Hi,

my zeplin.io email is: sven.hoehn@ipfire.org

We can try the SVG tinting method.

I installed Adium X, but never see somebody online, so I don’t know if it works.

On 26 Mar 2017, at 22:06, Maurice Gesswein <zerpixelung@gmail.com> wrote:

Hi all,

I'm going to release the first website screens and parts of the pattern lib at Zeplin. Everyone who wants to access the project need a free Zeplin account which I can invite. Sorry for the inconvenience. Additionally I can share PNGs of each screen. But you won't able to read comments which are written within the Zeplin project.
  1. Create a free account at www.zeplin.io
  2. Let me know the email address of your account to invite you to the project
--

@Sven

Do you have experience with tinting SVG images?
https://css-tricks.com/cascading-svg-fill-color/

Would this method work for you? If so we need all icons in only one color (black).

PS: Did you already tried out a Jabber client for MacOS?

On Sat, Mar 25, 2017 at 11:00 AM, Michael Tremer <michael.tremer@ipfire.org> wrote:
Hi,

On Fri, 2017-03-24 at 18:01 +0100, Maurice Gesswein wrote:
> At this stage it doesn't make sense to share the uncompleted stuff.
> It would cause a lot of questions which will not appear when I
> provide the complete set of viewports. You already know the final
> designs. I didn't change anything. Please give me the time to provide
> a professional handover to Sven. Otherwise it will become messy,
> believe me ;) I'm sorry that it takes some time. I'll publish the
> designs asap via Zeplin.

I didn't intend to put any pressure on at all. I just care about
everyone being happy and not getting stuck :)

> I'll prepare the captive portal designs as well.

Okay!

> Regarding Slack:
> Valid points against it. I agree. Jabber should do the trick as well.
> Not that comfortable but fine for me.
>
> Best,
> Maurice

-Michael

>
> Am 24.03.2017 2:29 nachm. schrieb "Daniel Weismüller" <daniel.weismue
> ller@ipfire.org>:
> > Hi 
> > Here are some infos about our jabber server.
> > http://planet.ipfire.org/post/opening-the-ipfire-jabber-server
> > or look here
> > http://wiki.ipfire.org/en/community/talk.ipfire.org/start
> > Weekdays I'm on there and mostly Michael, too.
> > -
> > Daniel
> > Am 24.03.2017 um 13:18 schrieb Sven:
> > > Hello,
> > > there are Open-Source Alternatives to Slack for example: https://
> > > about.mattermost.com
> > > I have nothing against this mailing list but when you have a
> > > longer conversation I think that it becomes a little bit hard to
> > > read, and for a conversation over the phone we don’t have enough
> > > to discuss (at the moment) :-D
> > > But IM with Jabber is fine for me.
> > >
> > > Greetings,
> > > Sven
> > >
> > > > Am 24.03.2017 um 12:57 schrieb Michael Tremer <michael.tremer@i
> > > > pfire.org>:
> > > >
> > > > Hi,
> > > >
> > > > On Wed, 2017-03-22 at 18:53 +0100, Maurice Gesswein wrote:
> > > > > I've copied the current Homepage design from Photoshop to
> > > > > Sketch to
> > > > > speed up in the future. Same with the styleguide/pattern
> > > > > library.
> > > >  
> > > > Cool. Can we access that in some way? The Dropbox thing has
> > > > vanished,
> > > > too and I had someone working on the Captive Portal which we
> > > > don't have
> > > > a copy of.
> > > >
> > > > > Next step is to design the key viewports for the homepage.
> > > > > Already
> > > > > started with that. I'm pretty busy in the evenings with
> > > > > private stuff
> > > > > like home improvements and annoying things which needs to be
> > > > > done.
> > > > >
> > > > > Furthermore I had the idea to create a Slack channel for a
> > > > > more
> > > > > comfortable collaboration with Sven. Discuss and share stuff
> > > > > very
> > > > > easily and fast. I have very good experience with that tool
> > > > > during
> > > > > the last ~2 years.
> > > > >
> > > > > What do you think Michael, would you sign up and create a
> > > > > IPFire
> > > > > Slack channel? The free basic version is totally enough.
> > > >  
> > > > I am very much against Slack. There are two main reasons:
> > > >
> > > > a) It is proprietary. We cannot rely on this being free for
> > > > forever and
> > > > I do not want to force anyone to sign up for something in order
> > > > to
> > > > communicate with people.
> > > >
> > > > b) We cannot archive it. The big advantage of a mailing list is
> > > > that we
> > > > have an archive of all messages that everyone can access from
> > > > everywhere.
> > > >
> > > > That's why I would like to keep the main conversation on this
> > > > list if
> > > > possible. For some work it makes more sense to do some instant
> > > > messaging or use a phone.
> > > >
> > > > For that we do have our own Jabber server and a SIP VoIP server
> > > > that
> > > > you can even call from your landline (this might be quite handy
> > > > since
> > > > you two are in different countries):
> > > >
> > > >  http://wiki.ipfire.org/en/community/talk.ipfire.org/start
> > > >
> > > > I hope this makes up for Slack. But if you have any other
> > > > reasons I
> > > > forgot to convince me, feel free to do so :)
> > > >
> > > > Best,
> > > > -Michael
> > > >
> > > > > Best,
> > > > > Maurice
> > > > >
> > > > > Am 22.03.2017 6:24 nachm. schrieb "Michael Tremer" <michael.t
> > > > > remer@ip
> > > > > fire.org>:
> > > > > > Hello guys,
> > > > > >
> > > > > > just wanted to check in on you and see how things are going
> > > > > > since
> > > > > > it has gone a
> > > > > > little bit quiet here.
> > > > > >
> > > > > > I am traveling over the next days again, but in case there
> > > > > > is
> > > > > > anything I can
> > > > > > help out with, please send me an email.
> > > > > >
> > > > > > Best,
> > > > > > -Michael
> > > > > >
> > > > > > On Wed, 2017-03-15 at 14:44 +0100, Sven wrote:
> > > > > > > Hey Maurice,
> > > > > > > no problem.
> > > > > > > I will do it with the variables: https://getbootstrap.com
> > > > > > > /css/#gr
> > > > > >  id-less so we
> > > > > > > have complete control.
> > > > > > >
> > > > > > > Greetings,
> > > > > > > Sven
> > > > > > >
> > > > > > >
> > > > > > > > On 15 Mar 2017, at 14:37, Maurice Gesswein <zerpixelung
> > > > > > > > @gmail.c
> > > > > >  om> wrote:
> > > > > > > > Hey Sven,
> > > > > > > >
> > > > > > > > do you think we can do a tiny customization at
> > > > > > > > Bootstrap 4's
> > > > > >  column grid
> > > > > > > > system? Just 24px gutter width instead of 30px? I found
> > > > > > > > a short
> > > > > >  guide for
> > > > > > > > that. Seems pretty easy.
> > > > > > > >
> > > > > > > > http://arnique.net/web-design/58/a-quick-guide-to-chang
> > > > > > > > ing-boot
> > > > > >  straps-gutter
> > > > > > > > -width/
> > > > > > > >
> > > > > > > > From my point of view it looks like you just need to
> > > > > > > > change
> > > > > >  this:
> > > > > > > > > .col-xs-1, .col-sm-1, .col-md-1 ...{more columns} {
> > > > > > > > >   padding-right: 15px;
> > > > > > > > >   padding-left: 15px;
> > > > > > > > > }
> > > > > > > > > .row {
> > > > > > > > >   margin-right: -15px;
> > > > > > > > >   margin-left: -15px;
> > > > > > > > > }  
> > > > > > > >   
> > > > > > > > to this:
> > > > > > > >
> > > > > > > > > .col-xs-1, .col-sm-1, .col-md-1 ...{more columns} {
> > > > > > > > >   padding-right: 12px;
> > > > > > > > >   padding-left: 12px;
> > > > > > > > > }
> > > > > > > > > .row {
> > > > > > > > >   margin-right: -12px;
> > > > > > > > >   margin-left: -12px;
> > > > > > > > > }
> > > > > > > >  
> > > > > > > > That would help me to follow consistent UI metrics.
> > > > > > > >
> > > > > > > > Best, Maurice
> > > > > > > >
> > > > > > > > On Tue, Mar 14, 2017 at 3:52 PM, Michael Tremer
> > > > > > > > <michael.tremer
> > > > > >  @ipfire.org>
> > > > > > > > wrote:
> > > > > > > > > It would be nice to keep the conversation in English
> > > > > > > > > since
> > > > > >  there are
> > > > > > > > > people
> > > > > > > > > reading our mailing lists who don't speak German.
> > > > > > > > >
> > > > > > > > > I know it might be a little bit complicated in the
> > > > > > > > > beginning
> > > > > >  but I am sure
> > > > > > > > > we
> > > > > > > > > will all get used to it :)
> > > > > > > > >
> > > > > > > > > -Michael
> > > > > > > > >
> > > > > > > > > On Tue, 2017-03-14 at 15:10 +0100, Sven wrote:
> > > > > > > > > > Hallo Maurice,
> > > > > > > > > > ich antworte einfach mal in Deutsch. Englisch kann
> > > > > > > > > > ich gut
> > > > > >  lesen und
> > > > > > > > > verstehen
> > > > > > > > > > aber schreibe es nicht so gern.
> > > > > > > > > >
> > > > > > > > > > Im Moment baut die Seite ja auf Bootstrap auf, wird
> > > > > > > > > > das
> > > > > >  nicht
> > > > > > > > > überflüssig wenn
> > > > > > > > > > du sowohl Grid als auch Pattern Library aufbaust?
> > > > > > > > > > In wie weit wir die Pattern Library über alle
> > > > > > > > > > Projekte
> > > > > >  teilen sollten
> > > > > > > > > wir
> > > > > > > > > > sehen wenn die Webseite steht, da die im Moment
> > > > > > > > > > Priorität
> > > > > >  hat.
> > > > > > > > > > Freu mich auf die Zusammenarbeit.
> > > > > > > > > >
> > > > > > > > > > Grüße,
> > > > > > > > > > Sven
> > > > > > > > > >
> > > > > > > > > > > On 14 Mar 2017, at 14:25, Maurice Gesswein <zerpi
> > > > > > > > > > > xelung@g
> > > > > >  mail.com>
> > > > > > > > > wrote:
> > > > > > > > > > > Don't worry about the delay :)
> > > > > > > > > > >
> > > > > > > > > > > As far as I can remember I didn't created
> > > > > > > > > > > responsive
> > > > > >  versions of the
> > > > > > > > > IPFire
> > > > > > > > > > > Website. It makes sense that these are at least
> > > > > > > > > > > almost
> > > > > >  done before
> > > > > > > > > Sven
> > > > > > > > > > > starts with coding. I don't want that Sven has to
> > > > > > > > > > > guess
> > > > > >  the font
> > > > > > > > > sizes,
> > > > > > > > > > > paddings, margins, line-height and so on. That's
> > > > > > > > > > > not his
> > > > > >  job :) So
> > > > > > > > > please
> > > > > > > > > > > stay tuned for a proper handover. I'm sure that
> > > > > > > > > > > will help
> > > > > >  Sven a lot.
> > > > > > > > > > > @Sven
> > > > > > > > > > > Hey Sven, nice to meet you :)
> > > > > > > > > > >
> > > > > > > > > > > I just want to give some information beforehand.
> > > > > > > > > > > You may
> > > > > >  already know
> > > > > > > > > that
> > > > > > > > > > > but I just want to get sure that we are both on
> > > > > > > > > > > the same
> > > > > >  level.
> > > > > > > > > > > My designs and layouts are based on a 8x8px grid
> > > > > > > > > > > (4x4px
> > > > > >  fallback) and
> > > > > > > > > are
> > > > > > > > > > > Atomic Design driven. Touch Targets are at least
> > > > > > > > > > > 48x48px.
> > > > > >  In some edge
> > > > > > > > > cases
> > > > > > > > > > > there might be less. Means that you will never
> > > > > > > > > > > see a
> > > > > >  "margin: 50px"
> > > > > > > > > because
> > > > > > > > > > > 50 is not dividable by 8 or 4. I would very
> > > > > > > > > > > appreciate if
> > > > > >  you could
> > > > > > > > > consider
> > > > > > > > > > > that within your code. That method provides a
> > > > > > > > > > > great
> > > > > >  support to follow
> > > > > > > > > a
> > > > > > > > > > > consistent line. I'm pretty sure that I'll
> > > > > > > > > > > provide all
> > > > > >  designs via
> > > > > > > > > > > zeplin.io. From that tool you will get (almost)
> > > > > > > > > > > every
> > > > > >  information you
> > > > > > > > > need.
> > > > > > > > > > > Margins, paddings, colors, font size, etc.
> > > > > > > > > > >
> > > > > > > > > > > Also I'm a big fan of Pattern Libraries. At least
> > > > > > > > > > > when it
> > > > > >  comes to the
> > > > > > > > > > > IPFire WUI there will be a lot of pattern usage
> > > > > > > > > > > to save
> > > > > >  time on your
> > > > > > > > > side.
> > > > > > > > > > > My strong guess is that it would make sense to
> > > > > > > > > > > have
> > > > > >  different Pattern
> > > > > > > > > > > Libraries for the Website/FireInfo and WUI. But
> > > > > > > > > > > that is
> > > > > >  totally up to
> > > > > > > > > you
> > > > > > > > > > > how to deal with that :) I think you already saw
> > > > > > > > > > > the
> > > > > >  first designs for
> > > > > > > > > the
> > > > > > > > > > > WUI?
> > > > > > > > > > >
> > > > > > > > > > > Hope that doesn't sound like an arrogant
> > > > > > > > > > > Designer.
> > > > > >  Believe me that one
> > > > > > > > > of my
> > > > > > > > > > > most important goals is to make the DEVs life as
> > > > > >  comfortable as
> > > > > > > > > possible by
> > > > > > > > > > > providing well prepared handovers. My experience
> > > > > > > > > > > with
> > > > > >  that is that we
> > > > > > > > > will
> > > > > > > > > > > get a great output and a professional looking
> > > > > > > > > > > UI/Website.
> > > > > > > > > > >
> > > > > > > > > > >
> > > > > > > > > > > Please let me know if you have any questions or
> > > > > > > > > > > concerns.
> > > > > > > > > > >
> > > > > > > > > > > Best, M
> > > > > > > > > > >
> > > > > > > > > > > On Tue, Mar 14, 2017 at 1:02 PM, Michael Tremer
> > > > > > > > > > > <michael.
> > > > > >  tremer@ipfire
> > > > > > > > > .org>
> > > > > > > > > > > wrote:
> > > > > > > > > > > > Hello Maurice,
> > > > > > > > > > > >
> > > > > > > > > > > > thank you for getting back in touch.
> > > > > > > > > > > >
> > > > > > > > > > > > On Tue, 2017-03-14 at 12:58 +0100, Maurice
> > > > > > > > > > > > Gesswein
> > > > > >  wrote:
> > > > > > > > > > > > > Hi Sven and rest of the gang,
> > > > > > > > > > > > >
> > > > > > > > > > > > > I nearly thought that the project has died.
> > > > > > > > > > > > > I'm glad
> > > > > >  to see that
> > > > > > > > > this is
> > > > > > > > > > > > not
> > > > > > > > > > > > > the case. Since it's very long time ago I
> > > > > > > > > > > > > have to
> > > > > >  check the old
> > > > > > > > > PSD
> > > > > > > > > > > > files
> > > > > > > > > > > > > within the next days and make sure that you
> > > > > > > > > > > > > get a
> > > > > >  good handover.
> > > > > > > > > > > > I can only apologise that everything took so
> > > > > > > > > > > > long. I
> > > > > >  would have
> > > > > > > > > liked to
> > > > > > > > > > > > see
> > > > > > > > > > > > this realised quicker but time just didn't
> > > > > > > > > > > > allow me to
> > > > > >  work on it.
> > > > > > > > > Luckily
> > > > > > > > > > > > Sven
> > > > > > > > > > > > is now on board to help out and together we
> > > > > > > > > > > > will get
> > > > > >  this done now!
> > > > > > > > > > > > > Perhaps I'll handover the designs via
> > > > > > > > > > > > > zeplin.io. I've
> > > > > >  made very
> > > > > > > > > good
> > > > > > > > > > > > > experience with that tool during last year.
> > > > > > > > > > > > > Please
> > > > > >  give me some
> > > > > > > > > days for
> > > > > > > > > > > > > preparing since I'm very busy right now.
> > > > > > > > > > > >  
> > > > > > > > > > > > So where have we stopped? As far as I can see
> > > > > > > > > > > > the
> > > > > >  designs for the
> > > > > > > > > index
> > > > > > > > > > > > and
> > > > > > > > > > > > features page are done. Is there anything I
> > > > > > > > > > > > forgot?
> > > > > > > > > > > >
> > > > > > > > > > > > I think what Sven mainly needs is the
> > > > > > > > > > > > background images
> > > > > >  that you
> > > > > > > > > used and
> > > > > > > > > > > > so on.
> > > > > > > > > > > > I am quite sure this doesn't need to be PSD in
> > > > > >  particular.
> > > > > > > > > > > > If required we can have a conference call with
> > > > > >  everyone, but I am
> > > > > > > > > not sure
> > > > > > > > > > > > if
> > > > > > > > > > > > there are any big questions that we cannot
> > > > > > > > > > > > discuss on
> > > > > >  the list.
> > > > > > > > > > > > Best,
> > > > > > > > > > > > -Michael
> > > > > > > > > > > >
> > > > > > > > > > > > > Thanks and best regards,
> > > > > > > > > > > > > Maurice
> > > > > > > > > > > > >
> > > > > > > > > > > > > On Tue, Mar 14, 2017 at 12:03 PM, Michael
> > > > > > > > > > > > > Tremer <mic
> > > > > >  hael.tremer@i
> > > > > > > > > pfire.
> > > > > > > > > > > > org>
> > > > > > > > > > > > > wrote:
> > > > > > > > > > > > > > Hi,
> > > > > > > > > > > > > >
> > > > > > > > > > > > > > to send emails to the list, you just need
> > > > > > > > > > > > > > to email
> > > > > >  to
> > > > > > > > > > > > > >   ipfire-artwork@lists.ipfire.org
> > > > > > > > > > > > > >
> > > > > > > > > > > > > >
> > > > > > > > > > > > > > I copied Maurice to your request and we
> > > > > > > > > > > > > > will wait
> > > > > >  until he
> > > > > > > > > replies.
> > > > > > > > > > > > > > Best,
> > > > > > > > > > > > > > -Michael
> > > > > > > > > > > > > >
> > > > > > > > > > > > > > On Mon, 2017-03-13 at 19:51 +0100, Sven
> > > > > > > > > > > > > > wrote:
> > > > > > > > > > > > > > > Hi Maurice,
> > > > > > > > > > > > > > > can you please send me the PSD files from
> > > > > > > > > > > > > > > the new
> > > > > >  layout
> > > > > > > > > (Homepage
> > > > > > > > > > > > and
> > > > > > > > > > > > > > > Featurepage)?
> > > > > > > > > > > > > > >
> > > > > > > > > > > > > > > Thanks,
> > > > > > > > > > > > > > > Sven
> > > > > > > > > > > > >  
> > > > > > > > > > > >  
> > > > > > > > > > >  
> > > > > > > > > >  
> > > > > > > > >  
> > > > > > > >  
> > > > > > >   
> >  
> >