Proposing UI changes

[clhenrick]

Proposing UI changes

by @clhenrick and @jueyang
cc @wonderchook

We sketched out a smoother UI flow for the HOT export tool during the #sotmus sprint day. The goals for the UI update is here are to 1) make the export workflow more apparent to new users 2) simplify site layout so that it does not overwhelm the users.

Language Change

The term "Jobs" has been renamed to "Exports" for less confusion to new users.

Start an export

The Hot Export homepage UI revision now immediately shows the user how to create a new export. Previous export jobs can be accessed in the "Exports" link which is located to the upper right between the "Log In" and "About".

The "New Job" page has been integrated into the home page. It has been simplified so that the user can choose a bounding box for a given area and set the parameters for Preset,Translation and Transform all on the same page rather than on separate pages.

The Expert Functions section currently at the bottom of the home page is now included under the heading Advanced. When the user is satisfied with their bounding box and parameter settings they then click the Create Export button and are sent to the summary page.

Upon first visiting the page a window is displayed over the map area which gives the user information from the original home page such as About, How to Get Started and Note, which may be closed by clicking on the "X" in the upper right corner and opened again by clicking on "About" in the menu bar.

Next to each parameter (Preset, Translation, Transformation, etc.) is an i circle icon that when clicked will display a window with information about each parameter.

Summary view

We've simplified the layout of the summary view of a single export and made the actions clearer.

Next Actions

@wonderchook @jueyang and @davejohn will publicize this proposal via different channels. Needs a developer :)

[wonderchook]

@dodobas we have the initial implementation of this. Could you put this up on a test server somewhere? https://github.com/mapmeld/hot-exports

[dodobas]

I got something... but not much :) As I have very little experience deploying Rails app, this may be a really simple issue.

So, on the current production server service runs on ruby-1.8.7 + rails-3.2.11 and that's the environment we should aim for.

After basic configuration of the production environment (apache2 + passenger) and modifying database connection parameters, I've executed RAILS_ENV=production rake assets:precompile which was enough to run the service with the latest database dump form the production database.

However, switching to this branch, creates an Response 500, for /en/wizard_area:

Processing by JobsController#wizard_area as HTML
  Parameters: {"locale"=>"en"}
  Rendered jobs/wizard_area.html.erb within layouts/application (4.7ms)
Completed 500 Internal Server Error in 149ms

ActionView::Template::Error (leaflet-0.7.2/leaflet.css isn't precompiled):
    1: <link type="text/css" rel="stylesheet" href="<%= asset_path 'leaflet-0.7.2/leaflet.css' %>"></script>
    2: <script type="text/javascript" src="<%= asset_path 'leaflet-0.7.2/leaflet.js' %>"></script>
    3: 
    4: <link type="text/css" rel="stylesheet" href="<%= asset_path 'leaflet-draw-0.2.4/leaflet.draw.css' %>"></script>
  app/views/jobs/wizard_area.html.erb:1:in `_app_views_jobs_wizard_area_html_erb___747486966_70209377487460'

Any ideas?

[emreiser]

Hey @wonderchook @jueyang and @davejohn, have you found someone to work on this? I looked through and start making some layout changes on https://github.com/emreiser/hot-exports/commits/er_ui_changes. Let me know if it's still needed!