UI カンソクスケッチ、はじめました

このサイトの新しいコンテンツとして「原一浩の UI カンソクスケッチ」というコンテンツを始めてみます。

どういうコンテンツかというと、Web UI のリサーチして気になった UI や自分で思いついたアイデアなどをプロトタイピングしつつ思索していくというコンテンツになります。

この記事ですが、他のブログ記事のように Markdown で書いてますが、React の コンポーネントを配置したり、インラインで書くこともできるように作ってあります。

例えばこんな感じです。

これは、文中に以下のようにコンポーネントを埋め込んでいます。コンポーネント定義自体もこの Markdown ファイル内に記載しているので、取り回しがしやすいです。

<CounterButton />

仕組みとしては、Markdown にそのまま React コンポーネントを書いたり、定義して実行させたりすることが出来るので、UI のプロトタイピング自体をコンテンツとして発信していく予定です。
いずれは、これらのプロトタイピング結果をオープンソース化したり、まとめたセミナーを行なったり、あと、もちろん仕事に活かしたりといろいろやれそうです。

今までカンソクインダストリーズで MDX の研究を熱心に続けていたのは、この企画をやりたいからでした。

• Okachi.js にて、MDX と Next.js について話しました
• next-mdx のリポジトリが Next.js のパッケージへ移行されました
• next-mdx-frontmatter で Next.js の MDX 内にて Front Matter を使う
• modern site generator で Markdown 文書の一覧を作成するには
• Next.js で MDX の一覧ページを作る、その続き

それから、余談ではありますが、このコーナーみたいに「原一浩の〜」なんて自分の名前をコーナー名にくっつけたのは初めてのことなので、本気でこのコーナーをやっていこうという意気込みのあらわれです。
今までやってきた「Web デザイントレンドレポート」の側面と「デザイナー / デベロッパー」の側面を融合させた感じのコンテンツになっていく予定です。

ということで、これからいろいろと面白いことをやっていこうと思いますので、よろしくお願いします。