Signal v. Noise で紹介されている UI flows図 をMarkdown風な記法で描写できる uiflow 記法に対応しました。
UI flows図 とは、「ユーザーが見るもの」とその結果「ユーザーがすること」を繋げる、以下のような画面遷移図です。
この図を uiflow記法では、以下のようにコードブロックに uiflow を指定して記述します。
```uiflow
[page1]
ユーザーが見るもの
---
ユーザーがすること
[page2]
ユーザーが見るもの
---
ユーザーがすること
==> page3
ユーザーがすること
==> page4
[page3]
ユーザーが見るもの
[page4]
ユーザーが見るもの
```
詳しい記法は「hirokidaichi/uiflow: uiflow - the simplest way to write down your ui-flow diagram like markdown 」を参考にしてみてください。
🎍 あけましておめでとうございます 🎍
今年もユーザーの皆様にとって便利な機能を作って行きたいと思います 🔧
2020年もよろしくお願いいたします
[ProTip] Webhookでdocs.esa.ioの更新通知を受け取れるようになりました!
Enjoy "(\( ⁰⊖⁰)/)"
https://esa.io
# 今回のリリース内容 [Signal v\. Noise](https://signalvnoise.com/posts/1926-a-shorthand-for-designing-ui-flows) で紹介されている __UI flows図__ をMarkdown風な記法で描写できる __[uiflow](https://github.com/hirokidaichi/uiflow)__ 記法に対応しました。 __UI flows図__ とは、「ユーザーが見るもの」とその結果「ユーザーがすること」を繋げる、以下のような画面遷移図です。 ```uiflow [page1] ユーザーが見るもの --- ユーザーがすること [page2] ユーザーが見るもの --- ユーザーがすること ==> page3 ユーザーがすること ==> page4 [page3] ユーザーが見るもの [page4] ユーザーが見るもの ``` この図を uiflow記法では、以下のようにコードブロックに __uiflow__ を指定して記述します。 <pre class="highlight plaintext"><code> ```uiflow [page1] ユーザーが見るもの --- ユーザーがすること [page2] ユーザーが見るもの --- ユーザーがすること ==> page3 ユーザーがすること ==> page4 [page3] ユーザーが見るもの [page4] ユーザーが見るもの ``` </code></pre> 詳しい記法は「[hirokidaichi/uiflow: uiflow \- the simplest way to write down your ui\-flow diagram like markdown](https://github.com/hirokidaichi/uiflow) 」を参考にしてみてください。 # 所感 :bamboo: あけましておめでとうございます :bamboo: 今年もユーザーの皆様にとって便利な機能を作って行きたいと思います :wrench: 2020年もよろしくお願いいたします :esa2: --- [ProTip] [Webhookでdocs.esa.ioの更新通知を受け取れるようになりました!](/posts/73) Enjoy "(\\( ⁰⊖⁰)/)" https://esa.io
Signal v. Noise で紹介されている UI flows図 をMarkdown風な記法で描写できる uiflow 記法に対応しました。
UI flows図 とは、「ユーザーが見るもの」とその結果「ユーザーがすること」を繋げる、以下のような画面遷移図です。
この図を uiflow記法では、以下のようにコードブロックに uiflow を指定して記述します。
```uiflow
[page1]
ユーザーが見るもの
---
ユーザーがすること
[page2]
ユーザーが見るもの
---
ユーザーがすること
==> page3
ユーザーがすること
==> page4
[page3]
ユーザーが見るもの
[page4]
ユーザーが見るもの
```
詳しい記法は「hirokidaichi/uiflow: uiflow - the simplest way to write down your ui-flow diagram like markdown 」を参考にしてみてください。
🎍 あけましておめでとうございます 🎍
今年もユーザーの皆様にとって便利な機能を作って行きたいと思います 🔧
2020年もよろしくお願いいたします
[ProTip] Webhookでdocs.esa.ioの更新通知を受け取れるようになりました!
Enjoy "(\( ⁰⊖⁰)/)"
https://esa.io