hotosm / learnosm

LearnOSM.org content, Jekyll layouts & issue tracking. This repository is dedicated to helping people learn how to map in OpenStreetMap (OSM) and use many of the software and tools in the OSM community.

LearnOSM

Repository for https://learnosm.org

Any updates in the gh-pages branch automatically update the site within minutes.

Contributing

For minor edits in English documents, simply locate the post you are interested in via the posts directory, and use the edit feature to fix typos, grammar and other minor items.

If you want to rework a document, submit a new document, modify pictures please contact us so that we can find the most convenient way for you. You may fork the project and submit a pull request but we nevertheless recommend to discuss your plans before investing a large amount of work.

Important: If you want to translate documents from English or improve one of the existing translations, please check out https://learnosm.org/en/contribute/translator/. We no longer accept translated contents in pull requests but use Transifex in order to manage translations.

learnosm's Issues

Image edit

@MappingKat

Can you take a look at the images and screenshots in existing content and make some edits?

The thumbnail-to-full approach works best with images with a maximum width of 520px. A few screenshots are two big for the functions to work well. Here are a few things I see:

• The images on the introduction page of the beginner section is not super necessary under the new structure. Maybe we can find some substitues?
• A few screenshots here is oversized.

Thanks!

IE

@jueyang - please review IE 8/9/10 and fix where there are easy fixes.

http://cl.ly/image/0q392i3A373E

`doc-nav` div misplaced on Firefox 19 Ubuntu

For example in this page: http://learnosm.org/en/beginner/ , I'm not able to click on the languages, to switch the current language.

I'm running Firefox 19 on Ubuntu.

Can we make gh-pages the main branch?

After #pull/6 went in can we make gh-pages the main branch of this repo?

/cc @wonderchook

(I'm not admin on this repo).

Slides!

What is the method of madness for putting the slides up? I would love to hear thoughts on that matter...

Proof reading needed for "Aerial Imagery" page

This one: http://learnosm.org/en/beginner/aerial-imagery/
I've found some typos while translating it, and also some sentences that seems to be "improvable". For example, the part about the resolution picture.

Teaching Content Format

Any thoughts on how we would like to organize the teaching guides?

In all of the sections, there will be:

• A general guide and agenda
• Activities
• Handouts (related to activities but more informative and less interactive... like the Mapping Process in Beginning guide)
• Quizzes (would love to hear opinions on the format of the quizzes... I was thinking of converting them all into Multiple Choice so that we can include answers at the bottom; however, some of the open ended questions are useful... Check Beginning Quiz and Intermediate Quiz
• Slides
• Intermediate has some .osm samples and Advanced will have some additional guides

Feedback on each guide page

Each guide page should have a line

"Was this chapter helpful? Missing information or got feedback? Let us know"

On the bottom of the page.

404 page

We need a 404 page.

Print friendly

The PDFs are currently available as Google docs but these will get outdated as pull requests come in. So, it looks like:

• A script should be available in the repo to generate the PDFs (using pandoc?)
• The generated PDFs should have links to them on the website
• Ideally, the PDFs should be generated after each pull request

Please add the BNPB logo to the footer

Please add the BNPB logo to the footer , the order from left to right should be: HOT, AusAID, BNPB

Walking Papers Broken

The walking papers service is broken. I verified that it does not work. The wikii says it has been broken for over a year.

http://wiki.openstreetmap.org/wiki/Walking_Papers

Looks like the project has moved to http://fieldpapers.org/

All of the references to walking papers should be changed to "field papers"?

Last review on Portuguese

@vgeorge - #43 was quite some surgery as files have moved in the meantime.

Can you take a last look at the Portuguese version and make sure I didn't miss any of your changes? I copied file contents whole sale, so you won't find a situation within a file where one of your fixes would have been applied while another one wouldn't. There is one exception.

Build out search function

We are thinking of auto complete with the linkable subject titles.

Redesign learnosm.org

@wonderchook cc/ @lxbarth

Hi Kate,

I worked with @lxbarth to redesign the layout and information architecture for learnOSM.org. The goals of the redesign are to

• accomodate new content for users at different skill levels
• turn existing workshop information into more versatile learning/teaching materials

Navigation

With the goals in mind, I've introduced new navigations to both the home page and the guides. The home page features more defined navigation buttons for different user scenarios. A search box allows the user to get straight to the guide section that has the answer. As new guides and translations become available, they will be added to the language and "our guides" links.

The "common questions" captures most introductory materials to OSM and will link to the respective sections of the guide in the answers.

Smaller batches of information

I've added a menu to each guide so that information can be easily accessed. Using the existing subtitles as navigation links, the users can expand the menu and navigate to the section to their interest. Each chapter will still be on one page, with the subtitles as anchors. So when users click on the link, they navigate to the anchor within that page.

With a collapsible menu, OSM wiki links can be added to specific sections as "further reading" rather than a general link. Videos can also be attached to their corresponding title.

Branding

The new design emphasizes the connection between learnOSM.org and openstreetmap.org by using

• a new logo for learnOSM.org
• existing color palette, especially the green, from openstreetmap.org

Feedback mechanisms

I've clarified different feedback mechanisms by incorporating email, twitter as well as a "contribute" page in the site.

By clicking "contribute to this site," the users will arrive at a page that includes information to

• add new materials
• improve the site build

Since the site is hosted on github, it will be easy for the user to add all sorts of content.

Next actions

Let's start a conversation. Please feel free to give me some feedback.

Migrate all content to markdown

We'll need to migrate all content to the new site

• Learning guides
• Teaching guides

This will mean:

• Come up with a process to do so (@lxbarth will have a look, any ideas welcome right away)
• Do it (this might require a call for volunteers to chime in)

Move out "Add presets" and "Walking Papers plugin" from "Getting started with JOSM"

I feel like that "Add preset file" and "Add Walking Papers Plugin" sections are just confusing in the "Getting started with JOSM" chapter.
I think we can move the "Add preset" section to a more advanced chapter, and the "Add Walking papers plugin" in the ad hoc chapter.

What do you think?

Exclude small images in thumbnail funciton

Make contribution page

Graphics

• one Illustration for each button
• trainer's guide
• hand

On hold for now. Will decide details once content is in place.

Friday night review

@jueyang - posting here the findings of our review just now:

• Kill middle nav beginner|intermediary|advanced
• Capitalize tag line (not all caps)
• Migrate all non-english beginner material
• Change color ads to:
  • Beginner
  • Decide what guides to migrate for link 2 and 3
• Common qestions should all link to beginners guide
• Larger pictures
• Keep dashed line on all pages
• Use colors from initial mockup on #1

Include AusAid logo

AusAid logo needs to be on LearnOSM with "Supported by: "

http://cl.ly/image/2A45383n381M

@jueyang - we should add a footer where we can place logos like this one. This should be very light and super clean IMO.

/cc @wonderchook

Design review

@samanpwbb Can you check out the site and give some design suggestions?

Ideally we can talk on Monday.

http://hotosm.github.com/learnosm/en/

Add translation system

My suggestion: http://www.transifex.com, upload .po files there and have them translated by community. It has working CLI tools so you can have even automatic pull/push workflow of new strings and translations.

Gather all content to be published on LearnOSM.org

Gather all content to be published on LearnOSM.org and link it from here:

https://github.com/hotosm/learnosm/wiki/Content

French translation

This issue is to coordinate ongoing French translation.

To contribute:

• Fork learnosm to your account
• Translate in french branch
• Issue pull request from your french branch to the learnosm/french branch

Before starting into a translation throw out a quick note here on the thread what you're immediately working on.

The immediate part is important, let's not block each other with future plans :-)

Need to Edit a Chapter. Where should I do that?

Hey there,

A HOT member has some chapter content that can be merged with a beginning chapter. It has better pictures and more details. Where should I edit it in? How should I link the images?

@learnosm

@wonderchook - are you working @learnosm?

@jueyang - want to create a quick logo icon for @learnosm? We're linking to it from footer.

Spanish translation

This issue is to coordinate ongoing Spanish translation.

To contribute:

• Fork learnosm to your account
• Translate in spanish branch
• Issue pull request from your spanish branch to the learnosm/spanish branch

Before starting into a translation throw out a quick note here on the thread what you're immediately working on.

The immediate part is important, let's not block each other with future plans :-)

Unearth polish version

According to balrog-kun there is a polish version of the beginner's guide in PDF format.

@jeffhaack - sounds familiar? Could you dig this up from the WordPress ghost town?

Chapter numbers

https://github.com/hotosm/learnosm/blob/gh-pages/_posts/en/0200-12-28-start-josm.md makes reference to numbered chapters, which do not exist on learnosm.org. The numbers also don't correspond consistently to the sections in the menu.

UI changes

1. sticky doc navigation
2. search bar on every page (default layout)

Updated Beginner Content

I just want to make sure that the new beginner content is being used. The website content is outdated. All of the new material is on the wiki. We can easily close this issue if the beginner content is being used.

QGIS guide etc?

I was just looking through this (haven't for awhile) and wondering if there will be room for additional guides? For example, we have an intro QGIS guide that has been translated into a couple of languages, and I'm wondering in the current site design if there is a plan for adding additional guides.

http://learnosm.org/files/ => 404

The "Getting started with JOSM" suggest to download a OSM sample from http://learnosm.org/files/ but this link goes in 404.

Remaining tasks

@lxbarth

I see a few tasks for myself immediately.

• continue to refine the graphics through out the site. This includes one image for each of the splash buttons on the frontpage, the image for the training guide box, and the hand.
• look into the thumbnail bug
• start making contribution page

Other Tasks:

• Format content

  It'd be nice if <p> and <li> are distinguished for different types of content. In the current documentations, paragraphs (no bullet) and lists (bullet points) are being used interchangably.

• Image editing (who can take a look over images)

  I've noticed a few extra-large images. All the images/screenshots should have a width less than 400px to achieve a consistent look.

• Translation status

• Search function

Cross browser testing

Images for icons too big

See icons here: http://learnosm.org/en/beginner/aerial-imagery/
I want to fix it but I can't find a way to re-size icons using MD at prose.

Content formatting

@MappingKat on #1:

Yea, sorry about the format content. Jeff and I should have clarified that
earlier. I think we were too overwhelmed with all of the information... I
think that for steps or directions in the guide we should have numbers.
Bullets should be used for descriptors. It's difficult because in some
cases we bullet points and in others we write paragraphs.

This issue is also true with the slideshows.

Improve contribute

The contribute ad shouldn't be The Hand of the Drowning but a simple banner or similar saying:

"Help us improve this guide"

linking to /contribute.

Draft text for /contribute:

Help us improve this guide

This guide is created and maintained by the OpenStreetMap and Humanitarian OpenStreetMap community. You can help us improve this guide by simply sending your feedback to or by contributing directly to it via GitHub.

Here are a couple of places where you can get started:

• Create a translation
• Improve language
• Fork and improve site

Launching

Here's my launch list for getting the first iteration of learnosm.org live. This will be a minimal version, focused on relaunching the most important content, linking to further content on Wiki. I think this will be fine for now, please let me know if not.

@wonderchook @MappingKat @jueyang - please let me know if you're seeing something missing here.

• @jueyang #33 design review
• @jueyang #29 Friday night review
• @jueyang #41 Add BNPB Logo
• @lxbarth #38 @learnosm
• @lxbarth #39 Switching domain
• @MappingKat @lxbarth Line up blog posts for hot.openstreetmap.org and mapbox.com

Front page typo: Beginner Guide -> Beginners' Guide

or Beginner's Guide or even Beginners Guide. But not Beginner Guide.

Bad look with dark system theme

Hi,
Web does not look well with dark system theme (grey text on dark background). See screenshot.

add section on adjusting imagery offset

Sample tutorial for P2: http://wiki.openstreetmap.org/wiki/WikiProject_Philippines/hires_imagery#Alignment_issue

Layout breaks on low widths

@jueyang - layout breaks now on low widths. I'm fine with a quick min-width fix for now.

http://cl.ly/image/0X133r2z1T0B

New section for ID

Future section for hot to use ID editor.
Tag as enhancement.

implement site structure

Hey everyone,

Based on #1, I've forked the repo and am starting to implement a few things for the site.

Starting goals:

• styling up front page
• basic navigation for guides and languages
• basic nav for each section

I will post updates periodically in the next few days.

Switching domain

@wonderchook - who can switch the learnosm.org domain to github? I've already created the necessary CNAME entry. All that's needed now to switch from current site to new site is this A record entry for learnosm.org (GitHub docs):

learnosm.org. 3259 IN A 204.232.175.78

There are still some final touches to do on site, but I'd like to tee this up.

Proof read for non-guide translations

@MappingKat cc/ @lxbarth @wonderchook @jeffhaack

I have finished beginner guide migration for languages with complete beginner materials, as mentioned in #31.

Each language comes with a homepage and other translated materials (such as the feedback box "Was this chapter helpful?" after each chapter). I have used google translate for these content. Could you or someone else proofread the content?

The translation for the tagline, contribute banner, feedback box and training box are in the _config.yml file.

Those for home page are the 0100-01-01-index.md under each language in the _posts folder.

Thanks!

Content migration for other languages

@MappingKat @jeffhaack @mvexel @aplannersguide cc/ @lxbarth

I've finalized all the site structure and _posts head matter. I've finished the English beginner's guide. Could any of you help migrating some content? Check out the wiki pages for:

• md conversion
• image processing
• file naming in _posts
• MD post formatting.