Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[blog] Blog post for MUI X mid v6. Date Pickers, Data Grid, and Charts #38241

Merged
merged 60 commits into from
Aug 14, 2023

Conversation

richbustos
Copy link
Contributor

@richbustos richbustos commented Jul 30, 2023

What?

This is a continuation of @joserodolfofreitas work on mid v6 blog. I added a few gifs to showcase some of the new features for MUI X v6.x.x and changed some of the content.

Also added a snippet for Discord announcement.

Preview: https://deploy-preview-38241--material-ui.netlify.app/blog/mui-x-mid-v6-features/

@mui-bot
Copy link

mui-bot commented Jul 31, 2023

Netlify deploy preview

https://deploy-preview-38241--material-ui.netlify.app/

Bundle size report

No bundle size changes (Toolpad)
No bundle size changes

Generated by 🚫 dangerJS against ff248aa

Copy link
Member

@joserodolfofreitas joserodolfofreitas left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for pushing the content for this blog post forward, Rich!

We should also add videos for clipboard copy/paste and the filters on headers. And I think we can improve the showcase by following the instructions on notion for high-quality media. For example, it'd be great to show mouse clicks, and we could keep all videos with the same "zoom"/resolution. Also, videos are preferred over gifs because of their quality.

Copy link
Member

@alexfauquette alexfauquette left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe a screen shot to visualise the filter on column headers could be a plus to catch attention on this highly requested feature

docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
@richbustos
Copy link
Contributor Author

Thanks for pushing the content for this blog post forward, Rich!

We should also add videos for clipboard copy/paste and the filters on headers. And I think we can improve the showcase by following the instructions on notion for high-quality media. For example, it'd be great to show mouse clicks, and we could keep all videos with the same "zoom"/resolution. Also, videos are preferred over gifs because of their quality.

@richbustos richbustos closed this Jul 31, 2023
@richbustos richbustos reopened this Jul 31, 2023
@richbustos
Copy link
Contributor Author

richbustos commented Jul 31, 2023

Also, videos are preferred over gifs because of their quality.

I had this debate in a previous company with another developer advocate which made me switch my mind.

So while I do agree that videos are higher quality, gifs gives the readers/users 1 less thing to do when reading blogs. Videos, you typically have to take action in order to play the video. MAybe we can have a mixture of both?

Gifs = Great to show component interaction like DatePicker.
Videos = Showcasing/displaying multiple components like all the different charts.

@samuelsycamore Would love your take on this as well.

EDIT: Just saw @joserodolfofreitas comment on using the loop attribute on the video. That is a solution as well.

Copy link
Member

@oliviertassinari oliviertassinari left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great to see progress on this post 👍

docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
@joserodolfofreitas joserodolfofreitas self-requested a review August 1, 2023 11:16
@richbustos richbustos marked this pull request as draft August 4, 2023 16:49
@richbustos richbustos changed the title [blog] Blog post for MUI X mid v6, Charts, and Discord [blog] Blog post for MUI X mid v6. Date Pickers, Data Grid, and Charts Aug 7, 2023
@richbustos richbustos marked this pull request as ready for review August 7, 2023 21:56
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
Copy link
Member

@LukasTy LukasTy left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice, great blog post! 👍
Leaving a few comments and potential improvement suggestions. 😉

docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
Copy link
Contributor

@samuelsycamore samuelsycamore left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

copyediting pass here - I tried to give explanations throughout but I'm happy to elaborate if anything is unclear!

docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
@@ -0,0 +1,133 @@
---
title: MUI X improvements, Charts in Alpha, Filtering, and more!
description: Support for time zones, a new filtering UI, charts and more..
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

How can we make this more descriptive, rather than just repeating the title?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I changed to:

title: Exciting MUI X improvements: v6.11.0
description: Support for time zones, Charts in alpha, Data Grid filtering, and more.

The previous title exceeded our 70 character limit. Is the new title too bland?

Copy link
Contributor

@samuelsycamore samuelsycamore Aug 9, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This about it this way: if you saw this blog post pop up on your twitter feed as you were mindlessly scrolling, what would convince you to click? In the world of copywriting, there are some tried-and-true techniques:

  • answer the question "what's in it for me (the reader)?" - you can also think of this as making your reader a promise in the title that you will fulfill in the content.
    • when I see "Exciting MUI X improvements," it's not clear what I'll get out of reading this. It sounds like maybe the creators just want to tell me how cool they are. 😜
  • identify the audience more clearly.
    • the current title doesn't tell me who this is for. Do we want to reach indie hackers? Engineering managers at enterprise firms? These audiences have very different needs, and if we try to appeal to both at the same time, we're more likely to appeal to neither.

Of course this stuff is easy to think about theoretically but really difficult to apply, especially in this context! The best thing you can do is brainstorm 5, 10, or even 20 different variations - every angle and word combo you can think of - and then narrow it down from there. (Not saying you have to do this, but it's the only way I know to get better at it.)

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

"How reading this blog post will give you 10x ROI on your project". lol jk.

Thanks for the tip. Brainstorming now!

docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
Copy link
Contributor

@samuelsycamore samuelsycamore left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

copyediting pass here - I tried to give explanations throughout but I'm happy to elaborate if anything is unclear!

docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved
docs/pages/blog/mui-x-mid-v6-features.md Outdated Show resolved Hide resolved

Check the [full instructions](https://mui.com/x/react-date-pickers/timezone/) for more information on using this feature in your application.

### Digital clock
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It could be interesting to show the analog clock and explain why it's not great for desktop but only for mobile, it would give more weight to why this is an exciting new feature.

@michaldudak
Copy link
Member

Can we include it in the release today?

Copy link
Member

@joserodolfofreitas joserodolfofreitas left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for all the effort, @richbustos!

@michaldudak, yes, it'd be great if this blog post is included in this week's release (thanks for the friendly reminder).

We can keep improving it in a new PR. A couple of opportunities I noticed:

  • Removing black lines from videos.
  • Resolution on header filters video.

@joserodolfofreitas joserodolfofreitas merged commit dea717b into master Aug 14, 2023
@joserodolfofreitas joserodolfofreitas deleted the v6-blog branch August 14, 2023 09:20

## Tree View is now part of the MUI X family

[Tree View](https://mui.com/x/react-tree-view/) will be migrating from the [lab](https://mui.com/material-ui/about-the-lab/) to Alpha and is now part of MUI X!
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

for the next PR, another thing to consider is to make it clearer that it can be already downloaded and tested (as we expect more feedback and feature requests).

Something along the lines.
Tree View has migrated from the lab to Alpha and is now part of MUI X! You can now download the pre-release package for testing.

Another suggestion is to ensure users that MIT features remain MIT.
But perhaps we can simply later link to the dedicated blog post.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah right, I was confused about this. I jump too quickly to a conclusion by changing the version to v5.11.1. Fixed in: 9bec39b.

I think the problem was:

Tree View will be migrating from the lab to Alpha and is now part of MUI X!

A component can't be part of MUI X and not be migrated at the same time.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.