new website

[gr2m]

@kidfribble and I met this weekend and discussed how to structure the new offlinefirst.org website. This is a long time coming, and I still owe you all a blog post based on the discussions we had in our first two Offline Camps (sorry @terichadbourne! Did not forget!). Our main goal is to make offlinefirst.org more collaborative, more owned by its community. We want to make it simpler to contribute to. At the same time, we want to keep it small and use it more like hub that references all the great projects from within and outside our community.

I will update this issue’s description based on @kidfribble and everyone else’s feedback

Structure

• welcome
  • process
  • resources
  • news
  • events
  • contribute

Pages

Welcome

Shorter introduction followed by content excerpts from the other sections, to give it more of an page overview feel

Process

Offline First is an approach / design process. You start with the most constraint environment first etc etc. We were thinking to turn our process and best practices into a little guide, something like Dockyard’s Design Sprints guide. This will be well written, concise and always up-to-date.

Resources

Basically an awesome offline-first list. With sub categories like tools, technologies, tutorials, design patterns, case studies, bussines cases, etc.

news

In addition to what we have today we suggest to post links to interesting news all over the internet as they occur. We will of course keep our newsletter and keep links to past issues.

contribute

Here is where we want to describe how people can contribute to the Open Source movement. Not only by contributing to the website, but by giving talks themselves, organising meetups and events, sharing their Open Source code, etc.

[terichadbourne]

Thanks for sharing @gr2m! I'd love to be involved w/ you and @kidfribble as this gets further fleshed out. Some initial questions...

• For the Resources page, does that have to be a static list where each resources sits under one category, and requires more and more scrolling as time goes on, or can it be a faceted search engine? Ideally we would have some database of all the resources we've found, tagged with format types (case study, event, video, podcast, interview, blog, article, etc.) and relevant content tags (UX, service workers, pouchdb, etc), and the user could control what subset of this they saw on the website.

• Re News and Resources - I would hope that all the awesome things @renrutnnej has found for the newsletter would also be included in the resources database and pull into listings of videos, case studies, tutorials, etc. there. In my mind, any suggestions people have for resources would go into one central spot to be added to both the site and the newsletter. Anything I could find (slowly) by opening each old newsletter and scrolling through I could also find instead by doing the faceted search in the resources database. (I was longing for this when I scoured the newsletter for podcasts recently - the tags in the newsletter were super helpful, but the process was time-consuming.) We could definitely save overall time by making it easier for Jenn & I to share resources we're hunting down instead of both doing our own hunting (currently her for newsletter and me for camp Twitter and YouTube).

• For quick reference, here's the very basic Resources page I built on Medium w/ links out to YouTube, portions of Offlinefirst.org, details on how to get involved, etc. - this is both "how to learn more" and "how to contribute": https://medium.com/offline-camp/offline-first-resources-2acc5836e9d4#.4ktme1t32 (not suggesting this is what the new resources or contributions page will look like, just want to ensure everything included here is also very easy to access from the new site.

• You included Events in your bulleted list but not your detailed page listing underneath. Do you still see that being its own page? If so, some issues I'd like to account for there include:
  (1) Being able to list multiple sessions per event, with separate URLs for each session plus one for the overall event.
  (2) Ability to differentiate btw event formats (conference, meetup, etc.)
  (3) Ability to include speaker names and link to their Twitter accounts or whatnot
  ^^^ I can force this all to happen manually if needed, just suggesting we could build in styling for the options we're most likely to need
  (4) Standard approach for dealing with past events and recorded sessions (right now we have a link to our YouTube channel
  (5) Is there a case for storing events as resources as we do the others (see my database suggestion below). If so, would it be helpful to have records to which we later add links to slide decks and videos of completed presos?

• Note that the website currently doesn't have a good place for podcast episodes, which I'm instead listing here: https://medium.com/offline-camp/offline-first-podcasts-d0be01721ee6#.ltv983lux Would those become part of the Resources page?

• Discussion forums is something that came up in our sessions at camp. Did you discuss implementing anything along these lines, or do you favor pushing all discussion to Slack?

• I don't see a Camp tab in your list. Are you planning to scrap that and only have it listed within the event listings?

[terichadbourne]

I just happened on the partially-written post about our website discussion from the Catskills, and thought it worth looking back on as we move forward with the redesign. Draft here: https://medium.com/offline-camp/building-a-central-community-hub-for-offline-first-7adb38f46d2c

A couple of the major points that came out of that Catskills discussion:

_We envision the offlinefirst.org site as a central resource that can address three main goals:

1. Describing WHAT Offline First is and WHY it’s important
2. Exploring HOW one builds an effective Offline First app
3. Building the Offline First COMMUNITY_

I'm assuming that the community piece happens primarily in the Contribute section you're proposing. Does the what/why live in the Welcome and the How live in a mix of the Process and Resources?

Another thing we talked about was identifying stakeholders and surrounding communities and making it easy for them to land on our site. So, for example, there could be a landing page focused on IoT or one focused on Healthcare for people who are only getting to know Offline First through those entry points. Did you discuss anything like that in your recent chat, @gr2m @kidfribble? One thing that might contribute to this goal is doing the faceted search engine (as suggested in my earlier comment) and having tags available related to industries. It would be nice to have more visually appealing landing pages, but worst case you could build the search engine so that a URL can take you to the search results for Healthcare tags, for example. And then in a Medium article about healthcare, we could easily link to all the relevant resources with a single reference.

[gr2m]

this is great input, thanks Teri!

[terichadbourne]

New additions since Offline Camp Berlin that will need homes on the updated website:

• the sync matrix which there's a first draft of online already (thx @bradley-holt!), but not linked to yet from anywhere on the site (http://offlinefirst.org/sync/) - see #sync-matrix channel in Slack for discussion on this
• PeerDrop P2P example (https://github.com/0x00A/peerdrop) - see discussion btw Fabian @filtercake & @janl in #camp Slack channel re where to locate this on the site.

[IrinaJay]

Thanks for the great input. Gregor and I had a few thoughts about it:

For the Resources page, does that have to be a static list where each resources sits under one category, and requires more and more scrolling as time goes on, or can it be a faceted search engine? Ideally we would have some database of all the resources we've found, tagged with format types (case study, event, video, podcast, interview, blog, article, etc.) and relevant content tags (UX, service workers, pouchdb, etc), and the user could control what subset of this they saw on the website.

Ideally we have all data on GitHub so we can collaborate on it, If we’d have a separate database, we’d need a content management system to be able to collaborate with the community. Instead we suggest to use Jekyll posts for Resources similar to how we use posts for team members and sponsors today. The posts would have properties like topics (IoT, health, emerging markets, design etc.) medium (podcast, video, case study, blog etc.). Based on these properties we could implement a simple search/ filter for the Resources section.

We could also add a side wide search using Google custom search: https://cse.google.com/cse/

Re News and Resources - I would hope that all the awesome things @renrutnnej has found for the newsletter would also be included in the resources database and pull into listings of videos, case studies, tutorials, etc. there. In my mind, any suggestions people have for resources would go into one central spot to be added to both the site and the newsletter. Anything I could find (slowly) by opening each old newsletter and scrolling through I could also find instead by doing the faceted search in the resources database. (I was longing for this when I scoured the newsletter for podcasts recently - the tags in the newsletter were super helpful, but the process was time-consuming.) We could definitely save overall time by making it easier for Jenn & I to share resources we're hunting down instead of both doing our own hunting (currently her for newsletter and me for camp Twitter and YouTube).

We are thinking about News being Jekyll posts as well, but in a short form. News are presented in short and are linked to the full article, blog, interview, podcasts etc, in the Resources section or anywhere on the web. The idea is not to create an additional blog, but rather link it to the original source. However, the news post would have a title and a short summary/ description of the content.
E.g. if there is a new post on the offline camp blog, we could also post a short news post that links to the original blog in the News section.

You included Events in your bulleted list but not your detailed page listing underneath. Do you still see that being its own page? If so, some issues I'd like to account for there include:
(1) Being able to list multiple sessions per event, with separate URLs for each session plus one for the overall event.
(2) Ability to differentiate btw event formats (conference, meetup, etc.)
(3) Ability to include speaker names and link to their Twitter accounts or whatnot
^^^ I can force this all to happen manually if needed, just suggesting we could build in styling for the options we're most likely to need
(4) Standard approach for dealing with past events and recorded sessions (right now we have a link to our YouTube channel
(5) Is there a case for storing events as resources as we do the others (see my database suggestion below). If so, would it be helpful to have records to which we later add links to slide decks and videos of completed presos?

We are thinking of having the Events listings more like the News section, where we would post a short description of the event (e.g. offline camp) and link to the event’s page. Meaning for the “official” events (offline camp, offline conference etc.) we would link to the dedicated website for these events (e.g. offlinecamp.org). Each event would have a date and location (country & city) that we could show on a map.
Everyone in the community can suggest an event which they organize or participate in.

Note that the website currently doesn't have a good place for podcast episodes, which I'm instead listing here: https://medium.com/offline-camp/offline-first-podcasts-d0be01721ee6#.ltv983lux Would those become part of the Resources page?

Yes

Discussion forums is something that came up in our sessions at camp. Did you discuss implementing anything along these lines, or do you favor pushing all discussion to Slack?

We’d suggest to have all discussions in Slack. GitHub issues are not well suited for generic discussions. We could also suggest to post questions on Stack Overflow using the offlinefirst tag.

I don't see a Camp tab in your list. Are you planning to scrap that and only have it listed within the event listings?

We would suggest to have dedicated website for offline camp and link to it from both the Events section as well as the offlinefirst.org landing page

Another thing we talked about was identifying stakeholders and surrounding communities and making it easy for them to land on our site. So, for example, there could be a landing page focused on IoT or one focused on Healthcare for people who are only getting to know Offline First through those entry points. Did you discuss anything like that in your recent chat, @gr2m @kidfribble? One thing that might contribute to this goal is doing the faceted search engine (as suggested in my earlier comment) and having tags available related to industries. It would be nice to have more visually appealing landing pages, but worst case you could build the search engine so that a URL can take you to the search results for Healthcare tags, for example. And then in a Medium article about healthcare, we could easily link to all the relevant resources with a single reference.

Topics can have their own landing page (e.g. offlinefirst.org/resources/health). This would also be really good for SEO.

[IrinaJay]

Gregor and I worked on the new website concept which you can find here:
https://docs.google.com/a/thehoodiefirm.com/document/d/1gf7t7bvIE0rQ8WNR01RicRG4yv9zXDFDyjpwK7SEsVM/edit?usp=sharing

We tried to consider everything that's been discussed in this issue, please feel free to edit and comment the doc. Any feedback is highly appreciated.

[terichadbourne]

@IrinaJay Just a heads up that that Google Docs link is giving an access denied error, so I've requested permission.

I'm just now seeing your responses to my questions from about a month ago, but I'll wait and take a look at that Google Doc before I respond.

Thanks!!

[gr2m]

@terichadbourne can you try again?

[terichadbourne]

@gr2m Working now. Thank you!

[IrinaJay]

@terichadbourne THX for notifying me. The document should now be open for anyone who wants to contribute.

[terichadbourne]

@gr2m @IrinaJay I have a few questions/comments specifically in respect to your response to my questions above. Would it be helpful for me to put those here in GH or should I instead find places for them in the Google Doc?

[IrinaJay]

@terichadbourne I think GH would be great for comments to our responses.