Request: Icons for use in ML map view

[alvarezmelissa87]

ML will be introducing a graph/map view https://github.com/elastic/kibana/issues/75295 This view a visual way to connect jobs to their source indices/transforms and resulting inference models.

Icons to represent transform, index, and inference models will be needed. Another icon to use as the map action will also be needed. The 'graphApp' icon is being used temporarily.

It would be great to have a default icon for ML as well.

cc @mdefazio

[mdefazio]

Posting here from our discussion on Slack: Provided some EUI glyph options as a starting point. These should probably be single color icons as they will be used alongside other EUI glyphs.

[alvarezmelissa87]

Thanks for the glyph suggestions, @mdefazio! 🙏

Here are the glyphs to be used as a starting point:

• visMapRegion works for the map action icon
• aggregate should work for Transform
• indexMapping is probably suitable for index

Follow up comments:

• is there a default icon we can use for when the type is not known?
• it would be good to have an icon that's more reflective of what a 'training model' is to use for the model nodes
• would it be possible to get 16x16 (or whichever size matches the glyphs) for regression / outlier / classification icons to use in the map so the sizes are consistent?

[cchaos]

I think we're running into an issue here where we're trying too much to optimize for re-use of existing glyphs that it misconstrues the meaning of the glyph itself.

For example, the timeline icon was created and is used specifically for the SIEM app's timeline feature. It could possibly be used to represent other timeline style data visualizations. However, trying to match it to mean Index pattern is not right.

Index pattern is a global feature of Kibana and Elastic. Conflating it with timeline via an icon will be very confusing to the user. A more appropriate icon here would be reuse indexPatternApp as it directly relates to the concept of index patterns.

---

For the map icon, I would actually continue to use the graph icon (colored singularly) as it best represents that type of network graph.

---

I see that in the PR screenshot, it's currently using shapes and a legend to indicate the different types of nodes. I actually think this is a much better approach than trying to re-use icons inside the nodes.

1. Even if you switched to icons, you'd still need a legend
2. It allows the text to be the prominent information.
3. Easier to scan and see compare the nodes types. It's much easer to compare a diamond shape to a circle than it is to compare a line-art icon to a line-art icon.

You do currently have 2 circles, though, with the only difference being an outline color. I'd lean more into shading of the whole node.

Here's an example of how much easier it can be to scan if you lean into shapes, shading and borders

[alvarezmelissa87]

@cchaos - those are good points. Here is a screenshot with the added icons (except for trained model) discussed above for comparison:

I think the analytics job type icons are necessary as the user needs a visual way to differentiate between types of jobs. As for the other icons - I see your point of leaning into borders/shading. Though would that approach work just as well for dark mode?

@peteharverson - any thoughts on this?

[mdefazio]

I don't think there should be any issue with finding variations of borders/shading that work in both light and dark mode. At the size shown, I don't think the icons are that discernable that I could guess what they relate to—they're purposely a bit similar so they relate when in cards shown side by side.

I think we could create sub-variations using shapes that provide better distinction at this level, but still show they are related as job types. (For example, maybe a circle with a square inside, and a circle with a triangle inside).

[peteharverson]

I like the use of shape and border color to distinguish between the four node types. @alvarezmelissa87 is there a fourth shape Cytoscape provides that we could use for the trained (inference) model node?

If we are sticking with icons inside the shape, the trained (inference) model node needs an icon too. Otherwise with its grey border and lack of icon, it appears less prominent in the map.

@cchaos could we use the indexMapping icon type for the 'index' type node- note strictly speaking this represents an ES index, and not an index pattern (correct me if I'm wrong @alvarezmelissa87). I agree the timeline icon is not appropriate here. Otherwise the indexPatternApp one works for me.

We need some way to distinguish between the different types of analytics jobs node (currently 3 types - Outlier, Regression and Classification). The job IDs in the screenshot here give a clue to the job type, but many users will not include the job type in the ID. If you could come up with sub-variations of the larger icons used in the wizard that would be great @mdefazio. That would also link the shapes in the map to those buttons in the wizard.

Looking at those icons, how about something involving:

• Outlier - circle with a circle inside (or would concentric circles look odd, giving it a target like appearance!?)
• Regression - circle with a square inside
• Classification - circle with a plus inside

Is increasing the size of the shape in the map an option, which would give @mdefazio more room to play with when designing the sub-variations?

[github-actions[bot]]

👋 Hey there. This issue hasn't had any activity for 180 days. We'll automatically close it if that trend continues for another week. If you feel this issue is still valid and needs attention please let us know with a comment.

[alvarezmelissa87]

I'd like to keep this open as I think it would still be good to get proper icons for all the node types. cc @mdefazio

[github-actions[bot]]

👋 Hey there. This issue hasn't had any activity for 180 days. We'll automatically close it if that trend continues for another week. If you feel this issue is still valid and needs attention please let us know with a comment.

[daveyholler]

@mdefazio Are you currently working on this bad boy?

[github-actions[bot]]

👋 Hi there - this issue hasn't had any activity in 6 months. If the EUI team has not explicitly expressed that this is something on our roadmap, it's unlikely that we'll pick this issue up. We would sincerely appreciate a PR/community contribution if this is something that matters to you! If not, and there is no further activity on this issue for another 6 months (i.e. it's stale for over a year), the issue will be auto-closed.

[mdefazio]

@alvarezmelissa87 do you want to revisit this? Perhaps there's more visibility for this view now?

[github-actions[bot]]

👋 Hi there - this issue hasn't had any activity in 6 months. If the EUI team has not explicitly expressed that this is something on our roadmap, it's unlikely that we'll pick this issue up. We would sincerely appreciate a PR/community contribution if this is something that matters to you! If not, and there is no further activity on this issue for another 6 months (i.e. it's stale for over a year), the issue will be auto-closed.

[peteharverson]

@joana-cps just re-read the comment thread back. The original request was to have icons for all the different types of nodes in the Analytics Map view:

• Index
• Ingest pipeline
• Transform
• Trained model
• Data frame analytics job (further divided into Outlier detection, Classification and Regression jobs)

Currently the only node type for which we have icons is the DFA job.

Questions were raised as to whether adding an icon to the current shape and color representation for each node adds any value. The available space inside the shape is small, so would any icon design really help the user understand the node represents e.g. a transform or an index? I think the only thing in favor of adding an icon is that something like https://github.com/elastic/eui/issues/4205#issuecomment-729880730 looks slightly more visually appealing than mostly empty shapes e.g.

Any thoughts? I'm so used to the empty shapes now, that this is low priority for me.

[joana-cps]

@peteharverson I talked with @alvarezmelissa87 and she also agreed that we can close this issue. People are used to the empty shapes now and rather than the visual side there's no real need for it at the moment.

[peteharverson]

Closing issue as no longer a priority. We will continue to use colors / shapes without an extra icon for the other node types in the map.