Lenom.io, search for people in your company

Humans are the :heart: of work.

Whether we are in a startup, a non-profit society or a large corporation, the essential need is to know the people we work with. Lenom is the obvious tool to find, discover and reach them…

mindblown

…the obvious tech was of course Algolia :metal:

Features

Find

We use Algolia to power the search by name and keywords: position, team, project, location, interests… We also have organizational tree navigation.

find_screen

Discover

We are free to introduce ourselves the way we want on Lenom. So in our profiles, we use
hashtags to show teams, skills or interests.

discover_screen

Reach

We already got tons of communication tools, Lenom is just here to find the right one to contact someone.

reach_screen

Demo

https://demo.lenom.io is a public organization to show off the search UX.
A regular instance is secured by email or google domain (like Slack does) so there’s only you and your colleagues inside :lock:
The big part missing from the demo is the onboarding, where users are very carefully guided through enriching their profiles with hashtags and teams.

Feedback

We’d love to read what you think about the implementation, the UX, and anything that comes through your mind actually. Please reply to this thread if you got something to say !
If you’re in Paris, grabing a drink is definitively the best idea ! :beers:

Beta

We’re looking for beta testers. If you believe Lenom is a good fit for your company (or non-profit), do signup, we’ll be in touch !

Code

Our stack is quite common: NodeJS+Express+Mongo+InstantSearch
Hosted on Heroku + mLab

Code on Github

9 Likes

Thanks for sharing (and for releasing the source to the public)!

3 Likes

Great implementations - well done!
I really like the “Discover” feature. I’m sure it will inspire others to do something similar.

1 Like

I would love to get inspired by others too, there’s still a lot of room for improvements. Especially in the Discover feature when looking at users writing their profiles : how can we help them find meaningful tags to describe themselves?
ie. How can we help someone who don’t know what to search.

I was happy to showcase Lenom.io Thursday night at a search party :blush:
Here is the talk & demo on Youtube.

PS: @alex thanks for reaching out, this is the thread we talked about.

1 Like

Lenom.io UX/UI Suggestions

Congrats on this initiative Clément! Lenom.io is an awesome tool from which countless companies could benefit and also a great example of how Algolia can help end-users to find other people in just a few keystrokes! Thanks for sharing it with the community.

We’ve recently onboarded a few new people in the Solutions Engineering team, and took the opportunity to run a few internal workshops on UX. We’ve analysed your current app and identified potential UI/UX improvements we’d like to share with you today.

1. Tab Display


We believe that making the visual seperation of All, People and Teams content is more obvious with different tab styling.
The ‘ALL’ tab makes the distinction between teams and people a little more clear and allows users to select one tab at a time.

2. All Tab - People Results

The layout of the individual person result is largely the same as the current version. Our suggestion would be to update the grouping of the results. We display a selection of people results (the number would depend on the viewport height) in a vertical layout, followed by a grouping of team results in a horizontal carousel. We want the team to stay visible, but by doing that it will make the user feel Lenom has preselected for them the best N results. We feel this is a convenient pattern for mobile and a great way to provide a visual breakdown. After a few team hits, we allow the user to keep focusing on people (our understanding was that users are probably the most likely to search for people).

3. All Tab - Team Results

In order to differentiate between the people and team hits, we chose a different layout for the team results, specifically: different dimensions with a background colour and a horizontal layout. As mentioned in the previous point, thanks to the ever increasing popularity of touch devices, people have grown accustomed to swiping left to view more content. This can also be a great way to maximise on space. On desktop we think it could be a regular carousel in which people can see a few teams before having a button “Show all’ that once clicked would lead to automatically focus on the “Team” tab.

4. Facets

Because users tend to not interact with things that are not openly available, we suggest that the filters on the left begin auto expanded.

5. Highlighted Results

Currently it is quite hard for a user to see what parts of the query matched, particularly in the description part of the record. We would suggest underlining the matching query text in the record to give users a better understanding of the records.

6. Highlight Based on Non-textual Matches

If a user’s query matches in a second attribute (such a location) contextually display feedback to the user where the match happened. For example, by making the matching attribute icon more visible and including a textual match. By displaying the matching attribute we help people to understand the result set. Improving their perception of the quality of the results, in addition to making their life easier in finding the record they’re looking for.

7. Hashtag guided search

Because lenom.io has the ability to search through hashtags, teams and people, it might be helpful to build the user’s query up as they go.
Here is a good example of a keyword suggestion guided search, along with the source code. This can help users with discovery by displaying hashtags matching the current query, and hashtags associated to the current result set using the faceting feature.
With mobile first in mind, it makes sense to have these suggestions in cloud/blob format below the search bar to have one visual flow of data. As the user types (for example ‘extra’), the bar could suggest tags that match the query separately from the main results list.

8. Alternatives to the InstantSearch experience.

Making search with ‘#’ or ‘@’ adds a level of complexity most users won’t leverage. Why not leverage Algolia’s query rules to automatically filter the results when a textual query matches either a tag or a team?

For example, if a user types ‘extrabed’, then Algolia can automatically apply a filter for results. This could be displayed as a tag in the search bar to inform the user that this filter has been applied.

Alternatively, it would be nice if they do not have to use the syntax explicitly, or to have an autosuggest like Slack’s that helps the user to ‘learn’ the syntax by having ‘Modifiers’ as one of the sections of the drop-down.
hints

If you have any questions about the topics we mentioned here please don’t hesitate to ping us!
Once again, this is an amazing project and we can’t wait to see where you take it next!

6 Likes

Thanks @tobi.weinstock and all the team :heart_eyes:
This feedback is tremendous and we’ve studied it carefully (thus explaining the time to reply :wink: )

For a few weeks now we are rebuilding our product and a lot of what you gave us will be implemented (plus we changed the name and branding).

The reason for the whole shabang is of course what we learned from our users:

  • What is the difference between person / teams / hashtags => That’s your 1-2-3
  • What is the left panel for? => That’s your 4.
  • What should I search for? => That’s your 5-6-7-8
  • What should I write in my profile ? => if the profiles are empty, what use is the app ? So we are doing or best to help users reveal their skills and passions. That’s actually a big reason why we also renamed and rebranded the app ! And of course that’s another use of Algolia :smile:

Here is the “revealing” feature we are working on:

And just for your eyes, a preview of the work on the search results to guide users in their search and provide more clarity in the results:

This new app will be ready before Spring and we will make sure to post the results here.
In the meantime, feedbacks and remarks on the above wireframes are more than welcome.

Thanks again for the love :kissing_heart:

1 Like

Hi Clement!
Thanks for your thoughtful reply and for sharing your further progress! The ‘revealing feature’ looks super cool. Here are some clarifications on our answers, hope they help:

  • What is the difference between person / teams / hashtags => That’s your 1-2-3

We recommended having an ‘all’ tab rather than having user select or de-select all categories. This is how most people are used to interacting with categories so it might be counter intuitive to have it work another way. In the ‘all’ tab we recommend visually differentiating between the different cards so that it’s very clear when a person is looking at a person vs. a team. That said, the ‘people’, ‘teams’ and ‘hashtag’ tabs would be the same as what you’ve already got going on.

  • What is the left panel for? => That’s your 4.

In the older version of your demo, there was a left panel that could be expanded out. It could be toggled under ‘tree organization’ . TBH we’re not sure what it was for, we just recommend leaving facets out rather than collapsed so that users will be more likely to interact with them. :slight_smile:

  • What should I search for? => That’s your 5-6-7-8

We recommend a guided search — that’s what 5 is for. This way when people search for something that would normally be under a hashtag, they can use that to filter their results.

6 and 7 recommend making matches visually clear — whether that’s textual such as in a name, or based on something else such as a location. This way people will better understand why a particular hit is being returned. Here’s an example of highlighting the location if someone were to type in ‘London’:

In 8, we’re just showing another type of search experience, but what you search for would be the same.

  • What should I write in my profile ? => if the profiles are empty, what use is the app ? So we are doing or best to help users reveal their skills and passions. That’s actually a big reason why we also renamed and rebranded the app ! And of course that’s another use of Algolia

Agreed — profiles are important and encouraging users to give stats like location, team, like and hobbies will allow for better results for the user. Looks like your new ‘revealing feature’ will be really helpful for this as well.

Please make sure to share with us your new version when it’s ready – we’re super excited to see it!

1 Like

Hello @maria.schreiber !
Sorry, it’s been a while, but we’ve been having a tremendous time launching our startup.
Your feedbacks have been very useful and we have much to show now.

First, we are now Wingzy, the intuitive app to spread your Wings at work.

As we talked about before, we put a lot of efforts into helping our users realize and reveal their potentials : soft skills, hard skills, passions… we call those Wings, and we use Algolia to suggest them to our users.

The results are impressive : with algolia suggestions, we went from an average of 3 Wings per user, to 10 ! With an average time for profile creation below 3 minutes, and more than 50% employees using the app weekly, we are far above the industry standards (HR software have less than 10% active employees and all skills evaluations we know take more than 30minutes).

Obviously the search is Algolia, and the UX is great, we improved the highlight and implemented the keywords suggestion @tobi.weinstock mentioned, which definitively helped our users get the idea of what to search for. There’s still much room for improvement, but user feedback are great so far.

To show you where we are:

Reveal your Wings

Search your coworkers

Hope you love what we did with Algolia, see you soon !