New ways to view and share Hylo: Product News

Clare Politano
Terran Collective
5 min readAug 23, 2022

--

We’ve just launched a new release! Hylo now has a few exciting new features and a significant design makeover.

Hylo Design Lead Aaron Brodeur has gone over the entire app and improved UI/UX across every view, focusing on usability, visibility, and readability. The result is a cleaner, fresher, and more organized interface.

Our new features are brought to you in partnership with our friends at Salmon Nation Trust, with whom we’re about to launch something very exciting. These features–Custom View, Grid View, Project Links, and Public Posts–are all about making Hylo more customizable for all kinds of groups.

Check out the Changelog below for all the details.

Metatron’s Dream by Robert Louthan, Bay Area artist

CHANGELOG

### Added

Custom Views
This powerful new feature allows group stewards to add any link you want to the left-hand navigation bar. What are the key links for your group? A drive, wiki, discord, commonwealth, docs, asana, youtube? Wherever you coordinate, you can now integrate that directly into your Hylo space. Find this feature in Group Settings. It’s as easy as dropping the link and selecting an icon.

Adding an external link to Hylo’s docs.

Here’s how they look in the group navigation:

Custom Views & Links show up in the Group Navigation

That’s not all — you can also use this feature to apply your own very particular filter conditions to your group’s content in Hylo, and add that custom view to the group navigation.

You can select one or more post types, filter by active/inactive, and even filter by up to 3 #topics. Tibet used this to create an Open Asks & Offers view in the Terran Collective group.

Setting up a Custom View — choose post types, active status, and #topics to filter by.

Grid View
Speaking of custom views, we’ve added not one, but TWO new ways to organize posts in the stream: Large Grid and Small Grid. These allow you to scroll through information at different density levels. Both views are streamlined to deliver the perfect amount of detail while offering a bird’s eye overview of activity in your group.

Use it for: creating the custom views of your dreams! The grid views are also great candidates to show in an iframe on your website if you want to give a wider audience visibility into what’s happening in your Hylo group.

Small Grid view

Project Links
We want to make Projects on Hylo as useful as possible, without reinventing any wheels. To that aim, we’ve added the ability to highlight key links for any project: a project management link, and a fundraising link. These links turn into big exciting buttons to help collaborators and contributors connect with your project. If you’re using a common service like Trello, Asana, GitHub, PayPal, Open Collective, and more, we automatically display the logo for that service.

When viewing a Project you’re a part of.
When viewing a Project in Grid view — go directly to the fundraising link by clicking Contribute.
Where to add Donation & Project Management links when creating a Project.

Use it for: crowdfunding a project, involving project members in tasks

Public Posts
Visibility into a Hylo group is pretty important for those who want to invite a wider audience into their community. To make activity on Hylo more accessible, we’ve added the ability to share Public Posts with anyone on or off Hylo–anyone can now view a Public post without being logged in. To make sharing even easier, there’s a new item in the post menu to copy the post URL to the clipboard (click the 3 dots in the top right of any post).

So go ahead and paste the link for any Public Hylo post into your slack, twitter, discord, etc and your friends will be able to check it out.

Use it for: sharing events, projects, requests, offers, and resources with a wider audience.

### Changed

- Many style improvements to post cards and post details to make them easier to read and interact with — more on this below.

- Cleaned up style of search page

- Changed the icon for the button to message someone from their profile to match the chat icon used elsewhere in the app

- Better handling of broken invite links for logged in users

### Fixed

- Bug that could unset a location or group area polygon when saving group settings

- Setting of prerequisite groups

- Editing of welcome message on Explore view.

  • Link to resend verification code on the verify email interface in case the first one didn’t come through or expired.

User Experience, Interface, and Design Upgrades

All new features incorporate the design upgrades we’ve made throughout the app. Here are some of the updates to look out for:

Increased visibility, readability, content density throughout

Before: Fonts too light in color, not enough contrast, font sizes and line heights not ideal for readability

After: Increased visibility of fonts throughout, more consistent sizing across elements, messages are easier to read

Events — Before
Events — After

Lefthand menu scroll behavior change
Before: When lefthand menu is too long because a group has too many topics, create a small scroll box for topics

After: Changed lefthand menu to scroll as one block if there are too many menu items, including topics

Stream improvements: Post cards
Updated post cards to have better visual hierarchy, and to make it easier to see the content. Reorganized the header and footer.

Post detail improvements
Reorganized the post details to provide better readability and general UX improvements like making the input box more easily visible.

Improved search page
Improved the search interface experience by making the results full screen and bringing the styling of the search input in line with new styles.

Slight improvements to Members page
Updated the members page to bring it in line with the new styles, including updating the search input and giving the cards a shadow.

Moved Group Settings and Invite Links to top right

We hope you enjoy the new features and upgraded design! Thanks for walking this journey with us.

With love,

Hylo stewards

Clare, Aaron, Tibet, Tom, Krisha, Rose

--

--

Clare Politano
Terran Collective

Software engineer & bioregional organizer building regenerative technology for collective governance @hylo @terrancollectiv.