UI / UX revamp aka Redesign

[phoet]

status: currently debating using 99designs for it
cost: 539€ minimum fee
funding: patreon https://patreon.com/on_ruby

create a forward looking design that is simple, leightweight and brightly colored. due to the simplicity and high contrast it is easy to use on mobile devices and loads quickly on low bandwith connections. it uses few and simple components that can easily be composed and maintained through a pattern library on top of a UI framework such as bootstrap or material. the logo needs to be modernized and iconified in order to fit the overall design.

since the site is a whitelabel, the design should be easy to customize to the color schemes and logos of the participating usergroups.

[phoet]

brief discussion with @hagenburger about how to proceed in 2 steps:

• fixup UX flaws
  • move login button out of the dropdown menu
  • add a signup button
  • move language chooser out of the dropdown menu
  • add CoC to the current event display
  • add a button to "signup" to onruby
  • add a button to propose job offers
• do the actual redesign

[phoet]

current structure

overview

www.onruby.de gives an overview of all usergroups on the site.

usergroup homepage

subdomains or custom domains point to this page (ie hamburg.onruby.de or rug-b.de).

the homepage has all information about the next meetup, the list of topics that are planned, presented or open, an overview of the people in the community, information from the mailing-list, a map of locations/companies where usergroups are held.

the call to action is: propose a topic

event detail page

more information on the current or past events can be seen on the event detail page. it holds general information about where and when it is, who hosts it, how to reach the location, title description etc.

it presents the topics/speakers that are lined up and a list of community members that are going to participate.

call to action: RSVP

topic detail page

people have the possibilty to propose topics to talk about, or wish for talks to be given. the topic can be upvoted on this page.

the call to action: +1 this topic

other detail pages

the user detail page holds information about what a person has talked about, visited, hosted etc. the location detail page holds information about the usergroups that happened there, how to get there etc. those pages are more the SEO kind of pages and they are reachable through the homepage or through index pages that list all availbe users/topics/locations.

[phoet]

we could aim for a simple layout where the usergroup has the option to provide 2 images to the layout, one for the logo part and one for a background stretch image. this could be similar to what patreon offers:

in terms of changing the content i think there are some obvious things like getting rid of the current mailing-list section, as those are basically all dead.

one thing that i would like to see in redesign is that speakers are highlighted and community members are encouraged to propose topics or ask for talks. this has been a recurring issue when organizing events, it's easy to find locations and hosts, but it's hard to get people exceted about given a talk.

[hagenburger]

@phoet thanks for the summary! I would do some quick drafts of the pages the next days.

[hagenburger]

We should also think about the mobile experience. Especially for “travelling“ user groups like RUG-B it’s very important to quick check the current location right before getting there.

[phoet]

did some groundwork in #564 for the redesign by introducing bootstrap in order to use the css grid componets etc.

looks basically the same except for some slight improvements