Difference between revisions of "WGO Redesign"

From GIMP Developer Wiki
Jump to: navigation, search
Line 35: Line 35:
  
 
== Role based access (git submodules) ==
 
== Role based access (git submodules) ==
 +
There was originally proposed utilizing [http://www.git-scm.com/book/en/v2/Git-Tools-Submodules Git submodules] as a means for segregating content/admin/presentation from each other within a repository.
 +
 +
I ([[User:Patdavid|Pat David]]) am not familiar enough with Git to speak to this, and could at some point use some input on the idea.
 +
As near as I can tell, the idea is that sub-folders of a Git project can be designated as sub-modules from other projects?
 +
 +
It appears that this may be something that can be separately addressed later in the process of implementing a new site.
 +
 +
  
 
== Content ==
 
== Content ==
 +
The content for the website can be decoupled from the presentation layer.
 +
One method of doing this is to house all of the content in an easy-to-use plain text format such as Markdown (or some combination of Markdown + html).
 +
 +
A benefit of separating the content from the presentation layer is portability of the content.
 +
It becomes easier later on to re-adapt the content layer to a new presentation layer as needed.
 +
This also helps to lower the barrier to entry, as any given piece of content is a self-contained folder of plain-text markdown (or html), as well as the associated assets needed.
 +
This is already similar to what is being done on WGO, but even further removing the presentation information as well.
 +
 +
Consider, for example, this snippet from the tutorial "GIMP Quickies":
 +
 +
<pre lang="html">
 +
<!--#include virtual="/includes/wgo-xhtml-init.xhtml" -->
 +
<title>GIMP - GIMP Quickies</title>
 +
<link rel="stylesheet" type="text/css" href="styles.css" />
 +
<!--#include virtual="/includes/wgo-look-feel.xhtml" -->
 +
<!--#include virtual="/includes/wgo-page-init.xhtml" -->
 +
 +
<h1>GIMP Quickies</h1>
 +
 +
<h2>Intention</h2>
 +
 +
<p>
 +
So you installed GIMP on your computer, congratulations! 
 +
GIMP is a very powerful image manipulation software, but don&rsquo;t let that intimidate you. 
 +
Even if you don&rsquo;t have time to learn advanced computer graphics, GIMP can still be a very useful and handy tool for quick image modifications.
 +
</p>
 +
<p>
 +
It is my hope that these few examples will help to solve those small, quick modifications that you may need to apply to an image. 
 +
Hopefully this will lead to learning even more powerful image editing capabilities that GIMP is capable of as well.
 +
</p>
 +
<p>
 +
For quick access, these are the four main points I&rsquo;ll cover in this quick tutorial:
 +
</p>
 +
<ul>
 +
        <li><a href="#scale">Changing the Size (Dimensions) of an Image (Scale)</a></li>
 +
        <li><a href="#compress">Changing the Size (Filesize) of a JPEG</a></li>
 +
        <li><a href="#crop">Crop an Image</a></li>
 +
        <li><a href="#transform">Rotate or Flip an Image</a></li>
 +
</ul>
 +
</pre>
 +
There are still some Server Side Include statements, as well as having to build out a valid HTML document while writing.
 +
This may cause extra burden on someone willing to contribute new content, but not comfortable with writing directly to HTML.
 +
 +
This same content, represented as Markdown, would look like this:
 +
 +
<pre>
 +
---
 +
title: "Gimp Quickies"
 +
author: "Pat David"
 +
...
 +
collection: tutorial
 +
---
 +
 +
# GIMP Quickies
 +
 +
## Intention
 +
 +
So you installed GIMP on your computer, congratulations! 
 +
GIMP is a very powerful image manipulation software, but don’t let that intimidate you. 
 +
Even if you don’t have time to learn advanced computer graphics, GIMP can still be a very useful and handy tool for quick image modifications.
 +
 +
It is my hope that these few examples will help to solve those small, quick modifications that you may need to apply to an image. 
 +
Hopefully this will lead to learning even more powerful image editing capabilities that GIMP is capable of as well.
 +
 +
For quick access, these are the four main points I’ll cover in this quick tutorial:
 +
 +
* [Changing the Size (Dimensions) of an Image (Scale)](#scale)
 +
* [Changing the Size (Filesize) of a JPEG](#compress)
 +
* [Crop an Image](#crop)
 +
* [Rotate or Flip an Image](#transform)
 +
 +
</pre>
  
 
== Presentation ==
 
== Presentation ==

Revision as of 20:04, 2 April 2015

Why?

The email from Cristobal on the Gimp-web list recently prompted this further discussion. His summary of work and ideas were documented on this page.


Assumptions

  • We (the royal 'We') could benefit from having more content on WGO, in particular tutorials.
  • Lowering the barrier-to-entry can help entice users to generate new content.
  • A new facelift can't hurt from a PR standpoint.


Benefits

There are a few possible benefits from conducting a redesign now:

  • Better organization of content
If the content organization is approached as described below.
  • Modern Look
  • A chance to consider usability and ease of access for users (and to improve it)
  • Lowering the barrier to entry for new contributors/contributions.


Summary

From an architecture standpoint, the general idea is to separate content from presentation. This is already how the current site exists, though the implementation is a little clunky.

  1. Possibly having role-based permissions against different areas of a git repository (admin, presentation, content, tutorials, news, etc...) (git sub-modules were mentioned as a way to manage this).
  2. The proposed idea is to separate WGO content into more user-friendly discrete pieces, such as individual Markdown text files.
  3. These text files (+assets) would then be passed through a processor to be turned into static HTML assets.
  4. These static HTML assets would then be served to users.


Role based access (git submodules)

There was originally proposed utilizing Git submodules as a means for segregating content/admin/presentation from each other within a repository.

I (Pat David) am not familiar enough with Git to speak to this, and could at some point use some input on the idea. As near as I can tell, the idea is that sub-folders of a Git project can be designated as sub-modules from other projects?

It appears that this may be something that can be separately addressed later in the process of implementing a new site.


Content

The content for the website can be decoupled from the presentation layer. One method of doing this is to house all of the content in an easy-to-use plain text format such as Markdown (or some combination of Markdown + html).

A benefit of separating the content from the presentation layer is portability of the content. It becomes easier later on to re-adapt the content layer to a new presentation layer as needed. This also helps to lower the barrier to entry, as any given piece of content is a self-contained folder of plain-text markdown (or html), as well as the associated assets needed. This is already similar to what is being done on WGO, but even further removing the presentation information as well.

Consider, for example, this snippet from the tutorial "GIMP Quickies":

<!--#include virtual="/includes/wgo-xhtml-init.xhtml" -->
<title>GIMP - GIMP Quickies</title>
<link rel="stylesheet" type="text/css" href="styles.css" />
<!--#include virtual="/includes/wgo-look-feel.xhtml" -->
<!--#include virtual="/includes/wgo-page-init.xhtml" -->

<h1>GIMP Quickies</h1>

<h2>Intention</h2>

<p>
So you installed GIMP on your computer, congratulations!  
GIMP is a very powerful image manipulation software, but don’t let that intimidate you.  
Even if you don’t have time to learn advanced computer graphics, GIMP can still be a very useful and handy tool for quick image modifications.
</p>
<p>
It is my hope that these few examples will help to solve those small, quick modifications that you may need to apply to an image.  
Hopefully this will lead to learning even more powerful image editing capabilities that GIMP is capable of as well.
</p>
<p>
For quick access, these are the four main points I’ll cover in this quick tutorial:
</p>
<ul>
        <li><a href="#scale">Changing the Size (Dimensions) of an Image (Scale)</a></li>
        <li><a href="#compress">Changing the Size (Filesize) of a JPEG</a></li>
        <li><a href="#crop">Crop an Image</a></li>
        <li><a href="#transform">Rotate or Flip an Image</a></li>
</ul>

There are still some Server Side Include statements, as well as having to build out a valid HTML document while writing. This may cause extra burden on someone willing to contribute new content, but not comfortable with writing directly to HTML.

This same content, represented as Markdown, would look like this:

---
title: "Gimp Quickies"
author: "Pat David"
...
collection: tutorial
---

# GIMP Quickies

## Intention

So you installed GIMP on your computer, congratulations!  
GIMP is a very powerful image manipulation software, but don’t let that intimidate you.  
Even if you don’t have time to learn advanced computer graphics, GIMP can still be a very useful and handy tool for quick image modifications.

It is my hope that these few examples will help to solve those small, quick modifications that you may need to apply to an image.  
Hopefully this will lead to learning even more powerful image editing capabilities that GIMP is capable of as well.

For quick access, these are the four main points I’ll cover in this quick tutorial:

* [Changing the Size (Dimensions) of an Image (Scale)](#scale)
* [Changing the Size (Filesize) of a JPEG](#compress)
* [Crop an Image](#crop)
* [Rotate or Flip an Image](#transform)

Presentation