Designing MyPaint.Org Website

Developer's Area
, ,
1

Continuing the discussion from The State of MyPaint.Org:

As stated in our blog post, State of MyPaint.Org, We have all the basics to at least have a functional website, however it really needs to more pleasing to the eye. It is a website show casing what MyPaint is and what can do with it. So we need design what our website will look like. This is where the community can help. We need your guys ideas of how we should design our website. It can be mockups and wireframe, or just links to themes or websites we can draw inspiration from. However here are somethings to keep in mind:

  • We like to keep our site as lean as possible.
  • The site needs to be responsive. I would like to use Pure.CSS Framework if possible.
  • Needs to have a Gallery Page, and Features Page.
  • Our Community Forum needs to follow its design as well. I will eventually like to embed it into MyPaint.Org itself.
  • Friendly for Wiki Documentation. I like how @davidrevoy pull this of with Pepper&Carrot’s Wiki.

This all I can think up for with requirements for our website for now. You can also help out by submitting you artwork in our Showcase Category so we feature it on our website. You can also post Screenshots of working in MyPaint or highlighting a feature as well. I would love to get a collection started so we can showcase what you can do with MyPaint as well.

Well that’s about all for now. MyPaint is a Community project, so it up to us to show the world what can with it. That means we need to create a great first impression and what a better way to capture them than with a good website design.

1 Like
2

Hey :slight_smile:
I’m sharing here http://www.peppercarrot.com/en/article333/website-update-wiki , my code for my integration of the Github wiki into my website.

Pros:

  • Editing, Security, Spam protection on the Github side, and it’s good.
  • Github wiki are Git repo, so I still have a local copy
  • Markdown stored in *.md text files

Cons:

  • Hard to scale this system to multilangage
  • Dependencies to Github ( commercial services are less and less popular after the Sourceforge issue)
  • The website host needs to have git and a cron job to update the wiki repo daily.
3

You know technically since jekyll is designed to generate webpages from markdown files, I could add the Wiki repos as submodules and let jekyll create the static pages. The only problem I see is inserting the front matter that Jekyll requires for each page, but I don’t think that would be hard to implement dose support default front matter. I just need to add the default front matter to our _config.yml file on our base site.

4

Another thing I would like to add is Prose.io support to make posting blogs on our site easier.

5

Here are related Github Issues for designing our website:

6

Now that I have time to actually work on this, I would like to get MyPaint’s website designed. Dose anyone have any jekyll themes and templates you would recommend to me that I can use as my base? I’m still a newbie when it comes to web design so I’ll need some help to get this done. Also If you will like your artwork showcased on our website, please let me know so I can get the gallery page propagated.

7

Hey everyone! I started sketching out some ideas, starting with the landing page.

checkit http://www.daiyi.co/mypaint.github.io/

(repo: https://github.com/daiyitastic/mypaint.github.io)

  • lean af, no js. I didn’t want to use an existing theme because they tend to be bloated
  • using purecss

Right now it’s very thrown-together so the visual idea is present so the code is not beautiful (’:

Eventually:

  • refactor for readability
  • css linting
  • extract jekyll theme to separate repo
8

Nice! I’m always a fan of lean and simple, and I like the idea of having a big image on top, seeing how MyPaint is a painting program and all. :wink:

If I may add one point to your todo list: Fix responsiveness. (… is that even a noun?) :slight_smile:

9

Just letting you know if you want a tool to help you with writing with Jekyll here’s a good site.

10

I found a couple other tools that might be useful for the site. Just pasting it here for referecne: