今回は、多くのプログラミング言語の中で、学ぶのに10分もかかりませんが、活用できる分野は本当に様々な言語を一つ紹介しようと思います。それは「<a href="https://ja.wikipedia.org/wiki/Markdown">markdown</a>」です！👏
&nbsp;
<h2 class="md-end-block md-heading md-focus">markdown とは？</h2>
2004年「ジョン・グルーバー」と「アーロン・スワッツ」により作成されたプレーンテキストフォーマットを基本とした軽量<a href="https://ja.wikipedia.org/wiki/%E3%83%9E%E3%83%BC%E3%82%AF%E3%82%A2%E3%83%83%E3%83%97%E8%A8%80%E8%AA%9E">マークアップ言語</a>です（拡張子は「.md」）。最近はgithubのreadme.mdファイルで多く利用されていますが、自分だけの文書や議事録などを管理する人もたくさんいるそうです。
&nbsp;
<h2 class="md-end-block md-heading">メリット</h2>
<ul class="ul-list" data-mark="-">
<li class="md-list-item">
簡単に学べる
</li>
<li class="md-list-item md-focus-container">
プレインテキストよりかっこよく書ける
</li>
</ul>
&nbsp;
<h2 class="md-end-block md-heading">基本文法</h2>
<h4 class="md-end-block md-heading">1. 見出し</h4>
<img loading="lazy" class="alignnone size-full wp-image-7891" src="/uploads-archive/lc/2021/06/1_heading-1.png" alt="" width="631" height="192" srcset="/uploads-archive/lc/2021/06/1_heading-1.png 631w, /uploads-archive/lc/2021/06/1_heading-1-300x91.png 300w, /uploads-archive/lc/2021/06/1_heading-1-600x183.png 600w" sizes="(max-width: 631px) 100vw, 631px" />
<h4>2. ライン</h4>
<img loading="lazy" class="alignnone size-full wp-image-7892" src="/uploads-archive/lc/2021/06/2_line.png" alt="" width="633" height="91" srcset="/uploads-archive/lc/2021/06/2_line.png 633w, /uploads-archive/lc/2021/06/2_line-300x43.png 300w, /uploads-archive/lc/2021/06/2_line-600x86.png 600w" sizes="(max-width: 633px) 100vw, 633px" />
<h4>3. 強調</h4>
<img loading="lazy" class="alignnone size-full wp-image-7893" src="/uploads-archive/lc/2021/06/3_emphasis.png" alt="" width="629" height="78" srcset="/uploads-archive/lc/2021/06/3_emphasis.png 629w, /uploads-archive/lc/2021/06/3_emphasis-300x37.png 300w, /uploads-archive/lc/2021/06/3_emphasis-600x74.png 600w" sizes="(max-width: 629px) 100vw, 629px" />
<h4>4. リスト</h4>
<img loading="lazy" class="alignnone size-full wp-image-7894" src="/uploads-archive/lc/2021/06/4_list.png" alt="" width="630" height="491" srcset="/uploads-archive/lc/2021/06/4_list.png 630w, /uploads-archive/lc/2021/06/4_list-300x234.png 300w, /uploads-archive/lc/2021/06/4_list-600x468.png 600w" sizes="(max-width: 630px) 100vw, 630px" />
<h4>5. 引用</h4>
<img loading="lazy" class="alignnone size-full wp-image-7895" src="/uploads-archive/lc/2021/06/5_quote.png" alt="" width="633" height="66" srcset="/uploads-archive/lc/2021/06/5_quote.png 633w, /uploads-archive/lc/2021/06/5_quote-300x31.png 300w, /uploads-archive/lc/2021/06/5_quote-600x63.png 600w" sizes="(max-width: 633px) 100vw, 633px" />
<h4>6. リンク</h4>
<img loading="lazy" class="alignnone size-full wp-image-7896" src="/uploads-archive/lc/2021/06/6_link.png" alt="" width="705" height="77" srcset="/uploads-archive/lc/2021/06/6_link.png 705w, /uploads-archive/lc/2021/06/6_link-300x33.png 300w, /uploads-archive/lc/2021/06/6_link-600x66.png 600w" sizes="(max-width: 705px) 100vw, 705px" />
<h4>7. イメージ</h4>
<img loading="lazy" class="alignnone size-full wp-image-7897" src="/uploads-archive/lc/2021/06/7_image.png" alt="" width="753" height="260" srcset="/uploads-archive/lc/2021/06/7_image.png 753w, /uploads-archive/lc/2021/06/7_image-300x104.png 300w, /uploads-archive/lc/2021/06/7_image-600x207.png 600w" sizes="(max-width: 753px) 100vw, 753px" />
<h4>8. テーブル</h4>
Tableのセル項目を中央中央寄せしたい場合は 「&#8211;」の前後に「:」を追加してください。→ | :&#8212;-: | :&#8212;-: |
<img loading="lazy" class="alignnone size-full wp-image-7898" src="/uploads-archive/lc/2021/06/8_table.png" alt="" width="749" height="204" srcset="/uploads-archive/lc/2021/06/8_table.png 749w, /uploads-archive/lc/2021/06/8_table-300x82.png 300w, /uploads-archive/lc/2021/06/8_table-600x163.png 600w" sizes="(max-width: 749px) 100vw, 749px" />
<h4>9. emoji</h4>
以下リンクからコードをコピーしてください。
<a href="https://www.w3schools.com/charsets/ref_emoji.asp" target="”_blank”" rel="noopener">https://www.w3schools.com/charsets/ref_emoji.asp</a>
<a href="https://www.webfx.com/tools/emoji-cheat-sheet/" target="”_blank”" rel="noopener">https://www.webfx.com/tools/emoji-cheat-sheet/</a>
<img loading="lazy" class="alignnone size-full wp-image-7899" src="/uploads-archive/lc/2021/06/9_emoji.png" alt="" width="755" height="83" srcset="/uploads-archive/lc/2021/06/9_emoji.png 755w, /uploads-archive/lc/2021/06/9_emoji-300x33.png 300w, /uploads-archive/lc/2021/06/9_emoji-600x66.png 600w" sizes="(max-width: 755px) 100vw, 755px" />
<h4 class="md-end-block md-p">10. code</h4>
<img loading="lazy" class="alignnone size-full wp-image-7900" src="/uploads-archive/lc/2021/06/10_code.png" alt="" width="751" height="81" srcset="/uploads-archive/lc/2021/06/10_code.png 751w, /uploads-archive/lc/2021/06/10_code-300x32.png 300w, /uploads-archive/lc/2021/06/10_code-600x65.png 600w" sizes="(max-width: 751px) 100vw, 751px" />
&nbsp;
githubではmarkdown標準から少し変形された「github flavored markdown」（オリジナルmarkdown以外の総称）を支援していますので、もっと勉強したい方はこちらのリンクを参照してください。
<a href="https://github.github.com/gfm/">https://github.github.com/gfm/</a>
<a href="https://guides.github.com/features/mastering-markdown/">https://guides.github.com/features/mastering-markdown/</a>
&nbsp;
<h2 class="md-end-block md-heading md-focus">活用編</h2>
<h4 class="md-end-block md-heading">github</h4>
githubでのreadme.mdを作成
<img loading="lazy" class="alignnone size-full wp-image-7901" src="/uploads-archive/lc/2021/06/01_github.gif" alt="" width="640" height="400" />
<h4 class="md-end-block md-heading">vscode</h4>
拡張子が「.md」のファイルを作成
Tip : プリビュー機能を使って書きながら確認できます。(すべてのコマンド「⌘+⇧+P (macOS)」から「markdown」で検索し、「Open Preview」を選択すると新しいタブが表示されます。)
<img loading="lazy" class="alignnone size-full wp-image-7902" src="/uploads-archive/lc/2021/06/02_vscode.gif" alt="" width="640" height="400" />
<h4 class="md-end-block md-heading">typora</h4>
markdownエディタで作成
おすすめのmarkdownエディタtyporaです。<a href="https://typora.io/" target="”_blank”" rel="noopener">こちら</a>からダウンロードできます。
<a href="https://theme.typora.io/" target="”_blank”" rel="noopener">テーマ</a>をダウンロードして外観を変えられるので、好みで変えて見てください。（ダウンロードしたテーマを自身でカスタマイズすることもできます！）
<img loading="lazy" class="alignnone size-full wp-image-7903" src="/uploads-archive/lc/2021/06/03_typora.gif" alt="" width="640" height="400" />
&nbsp;
以上、markdownのまとめでした。
ぜひ、皆んなさんも活用して見てください！🙌​

markdownまとめ

最近APIで使われるGraphQLについて調べてみました

Symfony2で利用されているDoctrineについて

small_202005b01.png

thumbnail_202005b01.png

202005b01.png

Crontabを設定してみた

ベルギーで開発された「Tally(タリー)」というwebサービスは独自のフォームを作成から管理、CSV出力まで一連として完了できるサービスであり、ドキュメントエディタの様な使用感覚によって簡単に使えることが可能となっている。
&nbsp;
<h3>フォームの作成</h3>
ダッシュボードからフォームの作成を選択すると以下のエディタ画面が表示される。
ここではフォームタイトルを決める事とフォームの始め方（１から作成orテンプレートから作成）を選ぶことが可能です。
<img loading="lazy" class="size-full wp-image-7473 aligncenter" src="/uploads-archive/lc/2021/05/b8a340fee1ebfb08c375012b8661bed3.png" alt="" width="1352" height="642" srcset="/uploads-archive/lc/2021/05/b8a340fee1ebfb08c375012b8661bed3.png 1352w, /uploads-archive/lc/2021/05/b8a340fee1ebfb08c375012b8661bed3-300x142.png 300w, /uploads-archive/lc/2021/05/b8a340fee1ebfb08c375012b8661bed3-1024x486.png 1024w, /uploads-archive/lc/2021/05/b8a340fee1ebfb08c375012b8661bed3-768x365.png 768w, /uploads-archive/lc/2021/05/b8a340fee1ebfb08c375012b8661bed3-600x285.png 600w" sizes="(max-width: 1352px) 100vw, 1352px" />
１から作成する場合はドキュメントエディタの様に直感的にラベルやフォームパーツを設置することができ、尚且つフォームパーツも入力ボックス、チェックボックス 、ファイルのアップロードなどの一般的なものに加え、決済機能やgoogleスプレッドシート と連携できるものもある為、様々な用途のフォームに対応しています。
また、プレースホルダーも手軽に設定できる為フォームの作成する方も入力する方もより分かりやすい仕様となっています。
<img loading="lazy" class="size-full wp-image-7475 aligncenter" src="/uploads-archive/lc/2021/05/5c268210447cc4364851822c137f1c7b.png" alt="" width="519" height="420" srcset="/uploads-archive/lc/2021/05/5c268210447cc4364851822c137f1c7b.png 519w, /uploads-archive/lc/2021/05/5c268210447cc4364851822c137f1c7b-300x243.png 300w" sizes="(max-width: 519px) 100vw, 519px" />
<img loading="lazy" class="size-full wp-image-7478 aligncenter" src="/uploads-archive/lc/2021/05/0431f2ced25e15394b960cf4afd23ffd.png" alt="" width="789" height="661" srcset="/uploads-archive/lc/2021/05/0431f2ced25e15394b960cf4afd23ffd.png 789w, /uploads-archive/lc/2021/05/0431f2ced25e15394b960cf4afd23ffd-300x251.png 300w, /uploads-archive/lc/2021/05/0431f2ced25e15394b960cf4afd23ffd-768x643.png 768w, /uploads-archive/lc/2021/05/0431f2ced25e15394b960cf4afd23ffd-600x503.png 600w" sizes="(max-width: 789px) 100vw, 789px" />
<img loading="lazy" class="size-full wp-image-7476 aligncenter" src="/uploads-archive/lc/2021/05/31138c46ae0b076ca1b4f5e8ad1fe6ea.png" alt="" width="505" height="368" srcset="/uploads-archive/lc/2021/05/31138c46ae0b076ca1b4f5e8ad1fe6ea.png 505w, /uploads-archive/lc/2021/05/31138c46ae0b076ca1b4f5e8ad1fe6ea-300x219.png 300w" sizes="(max-width: 505px) 100vw, 505px" />
フォームのページを追加したい場合は上のメニューより「page」を選択するとワンクリックで次のページを追加することができます。
<img loading="lazy" class="alignnone size-full wp-image-7477" src="/uploads-archive/lc/2021/05/18bc0d50b9600be7e6ea9465908b6334.png" alt="" width="1011" height="847" srcset="/uploads-archive/lc/2021/05/18bc0d50b9600be7e6ea9465908b6334.png 1011w, /uploads-archive/lc/2021/05/18bc0d50b9600be7e6ea9465908b6334-300x251.png 300w, /uploads-archive/lc/2021/05/18bc0d50b9600be7e6ea9465908b6334-768x643.png 768w, /uploads-archive/lc/2021/05/18bc0d50b9600be7e6ea9465908b6334-600x503.png 600w" sizes="(max-width: 1011px) 100vw, 1011px" />
フォームが完成し、フォームを公開する場合は上のメニュー内にある「Publish」を選択します。
この画面では先ほど作成したフォームを共有するためのリンクを生成してくれる事やwebサイトに埋め込むためのコードを生成してくれます。
<img loading="lazy" class="size-full wp-image-7479 aligncenter" src="/uploads-archive/lc/2021/05/1331402ec3a625377d778a00caf26990.png" alt="" width="867" height="843" srcset="/uploads-archive/lc/2021/05/1331402ec3a625377d778a00caf26990.png 867w, /uploads-archive/lc/2021/05/1331402ec3a625377d778a00caf26990-300x292.png 300w, /uploads-archive/lc/2021/05/1331402ec3a625377d778a00caf26990-768x747.png 768w, /uploads-archive/lc/2021/05/1331402ec3a625377d778a00caf26990-600x583.png 600w" sizes="(max-width: 867px) 100vw, 867px" />
<img loading="lazy" class="size-full wp-image-7480 aligncenter" src="/uploads-archive/lc/2021/05/80b0b6f9a485c19afc087f26c3af9e2b.png" alt="" width="799" height="820" srcset="/uploads-archive/lc/2021/05/80b0b6f9a485c19afc087f26c3af9e2b.png 799w, /uploads-archive/lc/2021/05/80b0b6f9a485c19afc087f26c3af9e2b-292x300.png 292w, /uploads-archive/lc/2021/05/80b0b6f9a485c19afc087f26c3af9e2b-768x788.png 768w, /uploads-archive/lc/2021/05/80b0b6f9a485c19afc087f26c3af9e2b-600x616.png 600w" sizes="(max-width: 799px) 100vw, 799px" />
埋め込んだフォームに実際に入力し、送信ボタンを押すと管理画面の方に「Responses」という項目の中に先ほど入力された情報が表示されます。
また、ここからCSVをダウンロードも可能となっている為、比較的手軽にフォームの導入からCSVの取得までができるということがわかりました。
<img loading="lazy" class="size-full wp-image-7485 aligncenter" src="/uploads-archive/lc/2021/05/a037d70b13a4703b798ffc297c9167ab.jpg" alt="" width="960" height="304" srcset="/uploads-archive/lc/2021/05/a037d70b13a4703b798ffc297c9167ab.jpg 960w, /uploads-archive/lc/2021/05/a037d70b13a4703b798ffc297c9167ab-300x95.jpg 300w, /uploads-archive/lc/2021/05/a037d70b13a4703b798ffc297c9167ab-768x243.jpg 768w, /uploads-archive/lc/2021/05/a037d70b13a4703b798ffc297c9167ab-600x190.jpg 600w" sizes="(max-width: 960px) 100vw, 960px" />
<h3>まとめ</h3>
今回「Tally」というフォーム作成webサービスを利用してみて、感じたことはやはりすごく簡単で使いやすいという部分でした。
基本的なフォームパーツは勿論、少し特殊なものも使えたりフォームの簡単なデザインを変更したりと今まで専門知識が必要であったこともこのサービスを利用することによって誰でも手軽にフォームを作成出来るということが検証できました。
管理の部分でも分かりやすいUIでストレスフリーに使える為、例えば簡単なアンケートを作りたいといった際などに作成から公開まで恐らく数分で完結してしまうと思われます。
フォームの公開期間の設定や入力後のメール設定なども可能な為、様々な場面で利用できると感じました。

手軽に独自フォームを作成「Tally」

文字の見やすさや美しさのためにカーニング（文字間隔）はTypographyにおいてとても重要です。 かつてWEB上では文字間隔で制御できるのはletter-spacing（等間隔で文字間隔を指定する）に限られ、半ば諦められていた項目でしたが、 フラットデザインが浸透し、Typographyの重要性が強くなったことや、text-align: justify;、font-feature-settings: &#8220;palt&#8221;; など文字間隔に関わるCSSの機能が充実してきたことなどで、WEBにおいてもカーニングが重要度を増してきているように感じます。 WEBのUIデザインツールとして人気を増しているFigmaでも１文字ごとのカーニングができるようになるなど、ツールの進化にもその重要性が見えてきます。



グラフィックデザインツールの大御所であるPhotoshopやIllustratorでは、カーニングに関する機能が充実しており、自動のオプションでかなり制度の高いカーニングが可能です。 ただ、自動オプションであるオプティカルやメトリクスって何だろうと思いながらも何となく使っていたのが正直なところです。



また、CSSで最近使われることの多くなってきた font-feature-settings: &#8220;palt&#8221;; というのも、何となく文字間隔がいい感じになるおまじないのような感覚で使ってきました。



ただ、何となく利用していると、使い方にむらが出たり、間違った使い方をしてしまう恐れもあります。 そこで今回、このあたりの機能について調べてみることにしました。



<h2>PhotoshopやIllustratorのカーニングオプションについて</h2>



<h3>メトリクスカーニング</h3>



Adobeの公式マニュアルを参照すると、



<blockquote class="wp-block-quote">メトリクスカーニングまたはオプティカルカーニングを使用すると、自動的に文字をカーニングすることができます。メトリクスカーニング（自動カーニングとも呼ばれます）では、ほとんどのフォントに含まれるペアカーニング情報が使用されます。ペアカーニングには、特定の文字の組み合わせに対する間隔情報が定義されています。この文字の組み合わせには、LA、P、To、Tr、Ta、Tu、Te、Ty、Wa、WA、We、Wo、Ya、Yo などがあります。メトリクスカーニングを使用するように初期設定されているので、テキストの入力または読み込み時に、特定の文字の組み合わせに対して自動的にカーニングが行われます。<cite>Adobe Photoshop での行と文字の間隔: <a rel="noreferrer noopener" href="https://helpx.adobe.com/jp/photoshop/using/line-character-spacing.html" target="_blank">https://helpx.adobe.com/jp/photoshop/using/line-character-spacing.html</a></cite></blockquote>



とのこと。 欧文フォント自体に設定されているカーニングの情報を使ってカーニングを調整する方法のようですね。フォントを作った方が設定した情報をもとにカーニングを行うので、利用可能であれば、高い精度のカーニングができそうです。 欧文フォントとありますが、OpenTypeのフォントでは和文フォントでもペアカーニングが設定できるようなので、和文フォントでもフォントによっては利用できそうです。



<h3>オプティカルカーニング</h3>



<blockquote class="wp-block-quote">欧文フォントの中には、固有のペアカーニング情報を持っているフォントもありますが、最小限のカーニングしか定義されていないか、まったくカーニングが定義されていないフォントを使用する場合や、1 行内に異なるフォントやサイズを使用している場合は、オプティカルカーニングオプションを使用してカーニングを調整します。オプティカルカーニングでは、文字の形状に基づいて、隣接する文字の間隔が調整されます。<cite>Adobe Photoshop での行と文字の間隔: <a rel="noreferrer noopener" href="https://helpx.adobe.com/jp/photoshop/using/line-character-spacing.html" target="_blank">https://helpx.adobe.com/jp/photoshop/using/line-character-spacing.html</a></cite></blockquote>



上記の通り、メトリクスカーニングはフォント自体に情報が設定されている場合にのみ利用でき、しかも設定されている文字の種類も限られている場合もあるため、フォントの情報に依存せずに設定するためにはオプティカルカーニングを利用する必要があるようです。 文字の種類の多い和文フォントではペアカーニングが設定されていない組み合わせも多そうですので、こちらを使うほうがいいかもしれません。



<h3>プロポーショナルメトリクス</h3>



<a rel="noreferrer noopener" href="https://note.com/kyonskmt/n/n844b20b7f58b" target="_blank">こちらの記事（少しの工夫でグッと良くなる！タイポグラフィTIPS｜kyon｜note）</a>で紹介されているのを見て初めて知りましたが、OpenTypeで選択できるカーニングの機能で、日本語特有の文字幅や仮想ボディを考慮した自動も自爪で、日本語のデザインではぜひ使いたいカーニング方法です。



<h2>font-feature-settings: &#8220;palt&#8221; とは？</h2>



フォントデータとして使われることの多いOpenTypeのフォントですが、このOpenTypeには文字の形以外にもたくさんの情報が内蔵されています。 その中でも拡張タイポグラフィの機能を有効化して利用できるのが、font-feature-settingsです（参考: <a rel="noreferrer noopener" href="https://developer.mozilla.org/ja/docs/Web/CSS/font-feature-settings" target="_blank">font-feature-settings &#8211; CSS: カスケーディングスタイルシート | MDN</a>）。 OpenTypeの設定なので、基本的にはOpenTypeを利用したときでなければ利用できません。（※ OpenTypeやTrueTypeを圧縮することで生成されるWEBフォント用のフォントデータであるWOFFやWOFF2もフォントによってはFireFoxでは利用できるようです（参考: <a rel="noreferrer noopener" href="https://developer.mozilla.org/ja/docs/Web/Guide/WOFF" target="_blank">WOFF (Web Open Font Format) &#8211; 開発者ガイド | MDN</a>）。



&#8220;palt&#8221;は別名を Proportional Alternate Widths と呼び、それぞれの文字の幅に合わせてカーニングを調整する機能で、和文フォントで威力を発揮します（参考: <a rel="noreferrer noopener" href="https://docs.microsoft.com/en-us/typography/opentype/spec/features_pt#tag-palt" target="_blank">Registered features, p-t (OpenType 1.8.4) &#8211; Typography | Microsoft Docs</a>）。



文字詰め方法としては、PhotoshopやIllustratorのOpenType用の設定で利用できるプロポーショナルメトリクスと近い仕組みのようです。 日本語の場合、文字の種類や大きさが複雑なので、利用できるのであれば利用したい機能です。



<h2>参考にさせていただいたサイト</h2>



<ul><li><a rel="noreferrer noopener" href="https://helpx.adobe.com/jp/photoshop/using/line-character-spacing.html" target="_blank">Adobe Photoshop での行と文字の間隔</a></li><li><a rel="noreferrer noopener" href="https://note.com/kyonskmt/n/n844b20b7f58b" target="_blank">少しの工夫でグッと良くなる！タイポグラフィTIPS｜kyon｜note</a></li><li><a rel="noreferrer noopener" href="https://developer.mozilla.org/ja/docs/Web/CSS/font-feature-settings" target="_blank">font-feature-settings &#8211; CSS: カスケーディングスタイルシート | MDN</a></li><li><a rel="noreferrer noopener" href="https://developer.mozilla.org/ja/docs/Web/Guide/WOFF" target="_blank">WOFF (Web Open Font Format) &#8211; 開発者ガイド | MDN</a></li><li><a rel="noreferrer noopener" href="https://docs.microsoft.com/en-us/typography/opentype/spec/features_pt#tag-palt" target="_blank">Registered features, p-t (OpenType 1.8.4) &#8211; Typography | Microsoft Docs</a></li><li><a href="https://www.morisawa.co.jp/culture/dictionary/1938" target="_blank" rel="noreferrer noopener">プロポーショナルメトリクス | フォント用語集 | 文字の手帖 | 株式会社モリサワ</a></li></ul>

「何となく」やっているWEBまわりのカーニングに関する機能について調べ直してみました

Reactで使えるスライダー、React Slickのご紹介

thumbnail_taxjar.jpeg

taxjar.jpeg

TaxJar API連携

WordPress Tavernは3月26日(米国時間)、「<a href="https://wptavern.com/wordpress-to-drop-support-for-ie11-in-upcoming-5-8-or-5-9-release">WordPress Considers Dropping Support for IE 11 After Usage Falls Below 1% &#8211; WordPress Tavern</a>」において、今後リリース予定のWordPress 5.8か、もしくはWordPress 5.9でサポート終了の対象となるとされている。
&nbsp;
<img loading="lazy" class="size-full wp-image-7024 aligncenter" src="/uploads-archive/lc/2021/04/4f1c68030428135801ee87aa3cfdbaba.png" alt="" width="1010" height="775" srcset="/uploads-archive/lc/2021/04/4f1c68030428135801ee87aa3cfdbaba.png 1010w, /uploads-archive/lc/2021/04/4f1c68030428135801ee87aa3cfdbaba-300x230.png 300w, /uploads-archive/lc/2021/04/4f1c68030428135801ee87aa3cfdbaba-768x589.png 768w, /uploads-archive/lc/2021/04/4f1c68030428135801ee87aa3cfdbaba-600x460.png 600w" sizes="(max-width: 1010px) 100vw, 1010px" />
<h6 style="text-align: center;">「WordPress Considers Dropping Support for IE 11 After Usage Falls Below 1% &#8211; WordPress Tavern」</h6>
&nbsp;
Webブラウザ全体に対してIE11のシェアが1%を下回った場合、WordPressはサポートの終了を検討する方針でおり、Microsoftは既にIE11の使用継続を推奨しておらず、Microsoft 365では2021年8月でIE11のサポートが終了される予定となっている。
またそれ以外にもIE11自体のサポートが終了していたり、WordPressの管理画面上で警告を行なっている等があげられる。
先ほどあげたwebブラウザのシェア率ですが、全世界でのInternet Explorerのシェアは1%を下回る結果となっており、また日本では現在3.45%という事で、少なくとも日本のユーザーにとっては影響があると思われる。
&nbsp;
<img loading="lazy" class="alignnone size-full wp-image-7025" src="/uploads-archive/lc/2021/04/8478a4a24c3471578139ca2e9bcc1117.png" alt="" width="1270" height="296" srcset="/uploads-archive/lc/2021/04/8478a4a24c3471578139ca2e9bcc1117.png 1270w, /uploads-archive/lc/2021/04/8478a4a24c3471578139ca2e9bcc1117-300x70.png 300w, /uploads-archive/lc/2021/04/8478a4a24c3471578139ca2e9bcc1117-1024x239.png 1024w, /uploads-archive/lc/2021/04/8478a4a24c3471578139ca2e9bcc1117-768x179.png 768w, /uploads-archive/lc/2021/04/8478a4a24c3471578139ca2e9bcc1117-600x140.png 600w" sizes="(max-width: 1270px) 100vw, 1270px" />
<img loading="lazy" class="alignnone size-full wp-image-7026" src="/uploads-archive/lc/2021/04/StatCounter-browser-ww-monthly-202002-202102.png" alt="" width="1280" height="720" srcset="/uploads-archive/lc/2021/04/StatCounter-browser-ww-monthly-202002-202102.png 1280w, /uploads-archive/lc/2021/04/StatCounter-browser-ww-monthly-202002-202102-300x169.png 300w, /uploads-archive/lc/2021/04/StatCounter-browser-ww-monthly-202002-202102-1024x576.png 1024w, /uploads-archive/lc/2021/04/StatCounter-browser-ww-monthly-202002-202102-768x432.png 768w, /uploads-archive/lc/2021/04/StatCounter-browser-ww-monthly-202002-202102-600x338.png 600w" sizes="(max-width: 1280px) 100vw, 1280px" />
<h6 style="text-align: center;">StatCounter GlobalStats</h6>
&nbsp;
しかしながらWordPressを使用する際にInternet Explorerに対応するという作業が恐らく今後は減っていくという事が大きな変化だと感じた。

WordPress Internet Explorer 11のサポートを終了を検討

今回紹介しますサービスは「SyncTube」というものでYoutubeにアップされている動画を同時に視聴できるというものであり、尚且つチャット機能も付いているという事で、例えば動画の修正をお願いしたい場合などクライアントと作業者が情報の共有をより正確に行えるのではないかと感じ、紹介します。
<h3>使い方</h3>
とてもシンプルで誰でも簡単に利用する事ができる点がこのサービスのメリットとなっており、 
まず「create room」か「browse rooms」を選択し、部屋を作るか入るかを選びます。
<img loading="lazy" class="size-large wp-image-6595 aligncenter" src="/uploads-archive/lc/2021/03/dd68e27beed2909990e15ab3507de43e-1024x541.png" alt="" width="1024" height="541" srcset="/uploads-archive/lc/2021/03/dd68e27beed2909990e15ab3507de43e-1024x541.png 1024w, /uploads-archive/lc/2021/03/dd68e27beed2909990e15ab3507de43e-300x159.png 300w, /uploads-archive/lc/2021/03/dd68e27beed2909990e15ab3507de43e-768x406.png 768w, /uploads-archive/lc/2021/03/dd68e27beed2909990e15ab3507de43e-600x317.png 600w, /uploads-archive/lc/2021/03/dd68e27beed2909990e15ab3507de43e-1536x812.png 1536w, /uploads-archive/lc/2021/03/dd68e27beed2909990e15ab3507de43e.png 1623w" sizes="(max-width: 1024px) 100vw, 1024px" />
<h4>「create room」を選択した場合</h4>

同時視聴したいYouTube動画のURLを上にある「Enter Youotube URL here」と書いてあるフォームにコピー＆ペーストすると動画が読み込まれます。
<img loading="lazy" class="size-large wp-image-6596 aligncenter" src="/uploads-archive/lc/2021/03/bad3a810521dfe7c727767560624fb92-1024x544.png" alt="" width="1024" height="544" srcset="/uploads-archive/lc/2021/03/bad3a810521dfe7c727767560624fb92-1024x544.png 1024w, /uploads-archive/lc/2021/03/bad3a810521dfe7c727767560624fb92-300x159.png 300w, /uploads-archive/lc/2021/03/bad3a810521dfe7c727767560624fb92-768x408.png 768w, /uploads-archive/lc/2021/03/bad3a810521dfe7c727767560624fb92-600x319.png 600w, /uploads-archive/lc/2021/03/bad3a810521dfe7c727767560624fb92-1536x816.png 1536w, /uploads-archive/lc/2021/03/bad3a810521dfe7c727767560624fb92.png 1685w" sizes="(max-width: 1024px) 100vw, 1024px" /> 
Settingsの部分ではユーザー名やユーザーカラー、部屋の公開・非公開設定、部屋の名前などを変更することができます。部屋を非公開にすると、URLを共有していない相手は部屋を見つけることができなくなりますが、URLを共有した相手は入室することができます。 
作成した部屋を共有したい場合はブラウザのURLをコピーし、相手等に渡すことによって簡単に共有する事ができます。 
また、共有されたユーザーもsettingsからユーザー名やユーザーカラーの変更が可能です。
<img loading="lazy" class="size-large wp-image-6597 aligncenter" src="/uploads-archive/lc/2021/03/c0a5c2010d168d10a5881e38a057d2b6-1024x608.png" alt="" width="1024" height="608" srcset="/uploads-archive/lc/2021/03/c0a5c2010d168d10a5881e38a057d2b6-1024x608.png 1024w, /uploads-archive/lc/2021/03/c0a5c2010d168d10a5881e38a057d2b6-300x178.png 300w, /uploads-archive/lc/2021/03/c0a5c2010d168d10a5881e38a057d2b6-768x456.png 768w, /uploads-archive/lc/2021/03/c0a5c2010d168d10a5881e38a057d2b6-600x356.png 600w, /uploads-archive/lc/2021/03/c0a5c2010d168d10a5881e38a057d2b6.png 1422w" sizes="(max-width: 1024px) 100vw, 1024px" />
右側のチャットスペースではリアルタイムでコメントや絵文字なども送る事ができるため、認識のズレ等が生じにくいと思います。 
デフォルトでは作成者のみがムービーの再生や停止、入室者のBANなどを行うことができますが、部屋の作成者は設定画面から参加しているユーザーの権限設定を変更することが可能です。
<img loading="lazy" class="size-full wp-image-6598 aligncenter" src="/uploads-archive/lc/2021/03/acdb7b59341b1dd1a0bac725d76023e4.png" alt="" width="380" height="674" srcset="/uploads-archive/lc/2021/03/acdb7b59341b1dd1a0bac725d76023e4.png 380w, /uploads-archive/lc/2021/03/acdb7b59341b1dd1a0bac725d76023e4-169x300.png 169w" sizes="(max-width: 380px) 100vw, 380px" /> 
もちろんスマートフォンからの参加も可能となっているため、出先などパソコンを広げられない状況でもコメント（指示など）を送る事が可能となっています。
<h4>「browse rooms」を選択した場合</h4>

いくつかオープンになっている部屋がありますが、基本海外の物が多くあまり使用する機会はなさそうと感じました。
<img loading="lazy" class="size-large wp-image-6599 aligncenter" src="/uploads-archive/lc/2021/03/57483841eecb6b4a97c4acca8c9e2555-1024x777.png" alt="" width="1024" height="777" srcset="/uploads-archive/lc/2021/03/57483841eecb6b4a97c4acca8c9e2555-1024x777.png 1024w, /uploads-archive/lc/2021/03/57483841eecb6b4a97c4acca8c9e2555-300x228.png 300w, /uploads-archive/lc/2021/03/57483841eecb6b4a97c4acca8c9e2555-768x583.png 768w, /uploads-archive/lc/2021/03/57483841eecb6b4a97c4acca8c9e2555-600x455.png 600w, /uploads-archive/lc/2021/03/57483841eecb6b4a97c4acca8c9e2555.png 1181w" sizes="(max-width: 1024px) 100vw, 1024px" />

本来、自分のお気に入りの動画を友達などと一緒に視聴するという目的のサービスですが、動画依頼のチェックにも使えそうという事で今回紹介させて頂きました。

Youtubeを同時視聴可能とし、チャット機能がついているサービスの紹介

LaunchCartフォーム機能で確認画面を飛ばしたりHTMLを自由に組む方法

今回は手軽に画面録画とそのまま編集できるブラウザのサービスを紹介していきます。 
専用のソフトなども必要なく、また無料で使用できる為とても便利なサービスとなっております。 
何よりも、編集部分に関してはアニメーション効果も多く用意されている為、マニュアル動画からプロモーション動画まで様々な用途に使用できます。
<h3>「RecordCast」の特徴</h3>
<h4>
メリット</h4>

・有料プランなどなく、無料で使用できる 
・ブラウザで動作する為、インストールが不要 
・webカメラとスクリーンの映像が同時に録画可能 
・編集がしやすい(編集ソフトのみの使い方も可能) 
・マイクやシステム音も同時録音可能
<h4>デメリット</h4>

・１回の録画時間が30分まで 
・保存できるプロジェクトが8つまで
<h3>録画のやり方</h3>

「Create by Record」を選択することによって録画のモードを以下の３つから選びます。 
・Screen+Webcam 
・Screen Only 
・Webcam only
<img loading="lazy" class="aligncenter size-full wp-image-6339" src="/uploads-archive/lc/2021/02/a2db1cc40a09b6643f57c2f5106771fa.png" alt="" width="1253" height="675" srcset="/uploads-archive/lc/2021/02/a2db1cc40a09b6643f57c2f5106771fa.png 1253w, /uploads-archive/lc/2021/02/a2db1cc40a09b6643f57c2f5106771fa-300x162.png 300w, /uploads-archive/lc/2021/02/a2db1cc40a09b6643f57c2f5106771fa-1024x552.png 1024w, /uploads-archive/lc/2021/02/a2db1cc40a09b6643f57c2f5106771fa-768x414.png 768w, /uploads-archive/lc/2021/02/a2db1cc40a09b6643f57c2f5106771fa-600x323.png 600w" sizes="(max-width: 1253px) 100vw, 1253px" />
次は録音設定でこちらも以下の４つから選びます。 
・マイク+システム音 
・マイク 
・システム音 
・なし
<img loading="lazy" class="aligncenter size-full wp-image-6340" src="/uploads-archive/lc/2021/02/8730212cd62c33d0a63b145ab43247a5.png" alt="" width="1206" height="644" srcset="/uploads-archive/lc/2021/02/8730212cd62c33d0a63b145ab43247a5.png 1206w, /uploads-archive/lc/2021/02/8730212cd62c33d0a63b145ab43247a5-300x160.png 300w, /uploads-archive/lc/2021/02/8730212cd62c33d0a63b145ab43247a5-1024x547.png 1024w, /uploads-archive/lc/2021/02/8730212cd62c33d0a63b145ab43247a5-768x410.png 768w, /uploads-archive/lc/2021/02/8730212cd62c33d0a63b145ab43247a5-600x320.png 600w" sizes="(max-width: 1206px) 100vw, 1206px" />
これで「Start Recording」を押し、全画面・ウィンドウ・Chromeタブを選択し録画開始になります。 
分かりにくい設定などほとんどなく、ストレスフリーに録画をすることが可能です。
&nbsp;
<h3>
編集の仕方</h3>

・録画後、すぐに編集する場合 
　「Edit and Export in MP4」を押すとそのまま編集画面に飛びます。
<img loading="lazy" class="aligncenter size-full wp-image-6342" src="/uploads-archive/lc/2021/02/703efb268ebe18b9190d12f092348fab.png" alt="" width="1200" height="775" srcset="/uploads-archive/lc/2021/02/703efb268ebe18b9190d12f092348fab.png 1200w, /uploads-archive/lc/2021/02/703efb268ebe18b9190d12f092348fab-300x194.png 300w, /uploads-archive/lc/2021/02/703efb268ebe18b9190d12f092348fab-1024x661.png 1024w, /uploads-archive/lc/2021/02/703efb268ebe18b9190d12f092348fab-768x496.png 768w, /uploads-archive/lc/2021/02/703efb268ebe18b9190d12f092348fab-600x388.png 600w" sizes="(max-width: 1200px) 100vw, 1200px" /> 
・プロジェクトから開く場合 
　RecordCastのトップに飛ぶとMy Projectsがあるので保存したプロジェクトを再度編集する場合はこちらから
<img loading="lazy" class="aligncenter size-full wp-image-6343" src="/uploads-archive/lc/2021/02/ff151397572aa1512cc2fa72b9fa8ffe.png" alt="" width="1253" height="566" srcset="/uploads-archive/lc/2021/02/ff151397572aa1512cc2fa72b9fa8ffe.png 1253w, /uploads-archive/lc/2021/02/ff151397572aa1512cc2fa72b9fa8ffe-300x136.png 300w, /uploads-archive/lc/2021/02/ff151397572aa1512cc2fa72b9fa8ffe-1024x463.png 1024w, /uploads-archive/lc/2021/02/ff151397572aa1512cc2fa72b9fa8ffe-768x347.png 768w, /uploads-archive/lc/2021/02/ff151397572aa1512cc2fa72b9fa8ffe-600x271.png 600w" sizes="(max-width: 1253px) 100vw, 1253px" />
&nbsp;
<h3>編集で「Create by Record」を使うべきメリット</h3>
<img loading="lazy" class="aligncenter size-full wp-image-6344" src="/uploads-archive/lc/2021/02/91d0a0b4f40e2acbc9620fe4dad6895a.png" alt="" width="1241" height="794" srcset="/uploads-archive/lc/2021/02/91d0a0b4f40e2acbc9620fe4dad6895a.png 1241w, /uploads-archive/lc/2021/02/91d0a0b4f40e2acbc9620fe4dad6895a-300x192.png 300w, /uploads-archive/lc/2021/02/91d0a0b4f40e2acbc9620fe4dad6895a-1024x655.png 1024w, /uploads-archive/lc/2021/02/91d0a0b4f40e2acbc9620fe4dad6895a-768x491.png 768w, /uploads-archive/lc/2021/02/91d0a0b4f40e2acbc9620fe4dad6895a-600x384.png 600w" sizes="(max-width: 1241px) 100vw, 1241px" /> 
このサービスにおいて一番便利だと思った部分が編集にあるアニメーションコンテンツのバリエーションの多さと素材の挿入(編集画面から直接録画開始可能)という事です。 
編集画面の左にあるタブには 
・Media 
・Text 
・Background 
・Element 
・Overlay 
があり、Mediaタブは挿入と録画をすることが可能。 
Textに関してはノーマルのベタのものからアニメーションが元々付いているものがあり、バリエーションも多くある為いろんな場面で使えるものとなっています。 
Elementは動くスタンプみたいなもので自社snsアカウントの紹介やボタンなどお洒落なものが気軽に配置することが出来ます。 
Overlayに関してもクオリティの高いアニメーションを使った動画の切り替えが可能となるものが多くあります。 
プレミアプロ の様に細かいアニメーションの調整は出来ないですが、その分編集が苦手な人でも問題なく使えると感じました。
<h3>まとめ</h3>

同じ様な編集が必要なマニュアル作成やオンライン授業、Web会議の録画などの用途にこのサービスはとても向いていると感じました。 
またブラウザ上で動作している為、動作も他の編集ソフトに比べ軽く感じました。 
簡単な編集・急ぎの動画編集などはこれらのサービスを利用してみても良いかと思いました。

ブラウザのみで画面録画＆編集可能な「RecordCast」

LaunchCartで直属の子カテゴリー一覧を取得する

こちらは人工知能(AI)を研究するOpenAIという団体が2021年1月5日に自然言語処理と画像生成を組み合わせたAIとして「DALL・E(デリー)」という愛称で発表しました。 
同団体より開発された、人間の様に高精度な文章を生成することができる「GPT-3」のパラメータを使用し、それによって文章からイラストや写真といった画像を生成することが可能となりました。
ここで使用されている「GPT-3」とは1750億個のパラメータで動作し、いくつかのキーワードを与えると人間が書いたような文章を生成する。その為か、「この言語モデルは危険すぎる」や「新たなブレイクスルーだ」などの議論を生むほどのもので、実際に技術者のマヌエル・アラオス氏が投稿したGPT-3に関するブログを、実は人間ではなくGPT-3が書いたものであることが話題を呼びました。
その言語モデルでありGPT-3を使用した今回の「DALL・E」は学習と推論を経て見たことがないものを予測できる様な技術となっている。
<a href="https://openai.com/blog/dall-e/">https://openai.com/blog/dall-e/</a>
<h3>画像生成例</h3>
「ネオンサイン」「openAI」というキーワードを使う事によって下記の様な画像を生成した。
原文：a neon sign that reads &#8216;openai&#8217;.(openaiと読むネオンサイン)
<img loading="lazy" class="aligncenter size-large wp-image-6085" src="/uploads-archive/lc/2021/01/b043e10fd7d10dbcef65ad59c05b4c0a-1024x702.png" alt="" width="1024" height="702" srcset="/uploads-archive/lc/2021/01/b043e10fd7d10dbcef65ad59c05b4c0a-1024x702.png 1024w, /uploads-archive/lc/2021/01/b043e10fd7d10dbcef65ad59c05b4c0a-300x206.png 300w, /uploads-archive/lc/2021/01/b043e10fd7d10dbcef65ad59c05b4c0a-768x526.png 768w, /uploads-archive/lc/2021/01/b043e10fd7d10dbcef65ad59c05b4c0a-600x411.png 600w, /uploads-archive/lc/2021/01/b043e10fd7d10dbcef65ad59c05b4c0a.png 1278w" sizes="(max-width: 1024px) 100vw, 1024px" />
「OpenAI」というネオンサインは現実には存在せず、すべてAIが文章をレンダリングし、作り上げています。
しかし、求められる文字列が長いほど画像生成の成功率は低くなる様です。
その他にもプロダクトデザイン、街の背景や手書きの様なスケッチも生成することが可能となっている。
<img loading="lazy" class="aligncenter size-full wp-image-6089" src="/uploads-archive/lc/2021/01/28d8b388e1fe0cd702a462e0939813c1.png" alt="" width="769" height="815" srcset="/uploads-archive/lc/2021/01/28d8b388e1fe0cd702a462e0939813c1.png 769w, /uploads-archive/lc/2021/01/28d8b388e1fe0cd702a462e0939813c1-283x300.png 283w, /uploads-archive/lc/2021/01/28d8b388e1fe0cd702a462e0939813c1-600x636.png 600w" sizes="(max-width: 769px) 100vw, 769px" />
この様に文章で画像を生成する技術が進歩する事によって起こる社会的影響も多く、特定の業種やサービスにとって将来的に与える影響は重要なものと考えられる。
また、これら社会的影響に関してはopenAIは認識しており、この技術が示唆する長期的な倫理的課題などの社会的課題とどのように関連しているかを分析する予定との事でした。

言葉の説明によって自動生成するイラストAI「DALL・E(デリー)」

Reactを部分導入する場合にReact root外の要素と連携する

主な動画編集ソフト：Adobe Premiere Proなどがあり、近年YouTube等で動画を個人で制作し、アップするという事が日常的に行われる様になってきた為、より動画制作が身近なものとなりました。
その為、動画編集ソフトも様々なものが出て来ました。 
今回はその中の一つとして、「DaVinci Resolve」という動画編集ソフトを紹介していこうと思います。
<a href="https://www.blackmagicdesign.com/jp/products/davinciresolve/whatsnew">https://www.blackmagicdesign.com/jp/products/davinciresolve/whatsnew</a>
<h2>DaVinci Resolveとは</h2>
Windows/Mac/Linuxに対応するフリーソフト(有償版有り)で、高機能な動画編集ソフトになります。 
カット編集、音声入力、テロップなどの編集に必要な基本的な機能を備えている上、Ultra HD解像度（3,840×2,160ピクセル）に対応しており、他の有償ソフトにも引けを取らないものとなっております。
<h2>無償版でできる事</h2>
・Ultra HD解像度での出力 
・60fpsまでのフレームレート 
・ほぼ全ての編集機能 
・ほぼ全てのカラー機能 
・ほぼ全てのFairlight機能 
　→ミキサー、EQ、ダイナミクス、サンプルレベルの編集機能、ADRツール、サウンドライブラリのサポート、FairlightFXオーディオプラグインなどを利用してオーディオミキシングを行えます。 
・ほぼ全てのFusion機能 
　→Adobe After Effectsの様な、映像にVFX(視覚効果)や3DCGを合成することができます。 
・ほぼ全てのファイルフォーマット
<img loading="lazy" class="aligncenter size-full wp-image-5888" src="/uploads-archive/lc/2020/12/speed-md.jpg" alt="" width="1000" height="500" srcset="/uploads-archive/lc/2020/12/speed-md.jpg 1000w, /uploads-archive/lc/2020/12/speed-md-300x150.jpg 300w, /uploads-archive/lc/2020/12/speed-md-768x384.jpg 768w, /uploads-archive/lc/2020/12/speed-md-600x300.jpg 600w" sizes="(max-width: 1000px) 100vw, 1000px" />
などなど、たとえ無償であっても動画編集に対して十分な機能が備わっております。 
アップデートはもちろん、商用利用なども認められております。
&nbsp;
<h3>最新版では</h3>
最新版となるDaVinci Resolve 17(2020年12月現在)では100種類以上の新機能および200種類の改良点を提供するメジャーアップデートが行われました。 
使える機能がかなり多くなる為、その中でもいくつかを紹介します。

・Magic Maskを使ったターゲットグレーディング 
　→的を絞った補正を行うために、人物を選択・トラッキングする作業が今まで以上に簡単になり、人物全体のマスク、または顔や腕など特定の部位のマスクを自動的に作成します。
<img loading="lazy" class="aligncenter size-full wp-image-5885" src="/uploads-archive/lc/2020/12/tracking.jpg" alt="" width="490" height="262" srcset="/uploads-archive/lc/2020/12/tracking.jpg 490w, /uploads-archive/lc/2020/12/tracking-300x160.jpg 300w" sizes="(max-width: 490px) 100vw, 490px" />

・ベクトルシェイプをカスタマイズ 
　→モーショングラフィックスの作成を容易にし、アニメーションをカスタマイズできます。
<img loading="lazy" class="aligncenter size-full wp-image-5886" src="/uploads-archive/lc/2020/12/nodes.jpg" alt="" width="493" height="262" srcset="/uploads-archive/lc/2020/12/nodes.jpg 493w, /uploads-archive/lc/2020/12/nodes-300x159.jpg 300w" sizes="(max-width: 493px) 100vw, 493px" />
&nbsp;
まだまだここでは伝え切れない程の気になる機能がたくさんありますので機会があればぜひ皆さんもさわってみて下さい。
&nbsp;
参考サイト
・YouTubeへの動画アップロードも可能！ 無料で多機能の動画編集ソフト「DaVinci Resolve」　<a href="https://forest.watch.impress.co.jp/docs/review/1287693.html">https://forest.watch.impress.co.jp/docs/review/1287693.html</a>
・DaVinci Resolve 無償で高機能な動画編集ソフトについて
  <a href="https://www.pc-koubou.jp/magazine/37640">https://www.pc-koubou.jp/magazine/37640</a>
・DaVinci Resolveの無償版と有償版の違いは？　<a href="https://vook.vc/n/224">https://vook.vc/n/224</a>

高性能の動画編集ソフト「DaVinci Resolve」の紹介

<h3>はじめに</h3>
<div style="padding-left: 15px;">
 最後の投稿は技術から離れてマインドの投稿です。 
 自身の持論と経験に基づく考えですので 
 一般的ではなく役に立つかどうかは不明ですが綴っておきたいと思います。
 大きく分けて以下を記述します。
<ul>
<li>定義</li>
<li>&#8220;成功&#8221;時と&#8221;失敗&#8221;時の違い</li>
<li>道筋が大事</li>
</ul>
</div>
<h3>定義</h3>
<div style="padding-left: 15px;">
 以下に記述していく「成功」「失敗」の定義です。
 シンプルに 
 「思い描いた通りの結果になる」 
 「思い描いた通りの道筋を描く」 
 というのを&#8221;成功&#8221;パターンとし、 
 その逆を&#8221;失敗&#8221;パターンと定義します。
</div>
<h3>&#8220;成功&#8221;時と&#8221;失敗&#8221;時の違い</h3>
<div style="padding-left: 15px;">
 自他共に経験的に違うものとして大きなものが
 「成功すると思っていない」 
 「成功イメージが出来ていない」 
 「成功時と&#8221;現在&#8221;の違いを認識出来ていない」
 という傾向が多かったです。
 1つ目は何となくやっていたり 
 自信がなく「本当に出来るかなぁ」などと 
 確信を持たずに行動して上手くいくケースは稀です。
 2つ目は「成功した時の像を描いていない」というケース。 
 「どういう状態であれば成功しているだろう」 
 と言う未来の自分を描くことなく、これも何となく進んでいることで 
 実際は進んでおらず変わらない、あるいは後退することがある。
 3つ目は「成功イメージに対して&#8221;今の自分&#8221;に何が足りていないか」 
 を正確に認識出来ていないケース。
 成功するにはシンプルに「成功」してる未来の自分と 
 「今現在の自分」を結びつけてあげれば良いのですが 
 その違いを埋めて行く際に「違い」そのものの認識が誤っている、 
 あるいは「違い」が埋まっていないなどの問題が生じるケースもあります。
 すべての共通解決方法として 
 「何に向かっていくべきか」 
 「その到達地点にあって今は無いものは何か」 
 「到達地点に向かっていく過程において、本当に向かっているか」 
 をしっかりイメージ出来れいれば多少の知識・経験の不足などは問題ではないと考えています。
 実際、自分自身が上手く行かなった時を思い返すと 
 「成功する」という確信はなく、未来の像を具体的にイメージ出来ておらず 
 進んでいる過程が「前進している」という感覚が無いときがほとんどでした。
</div>
<h3>道筋が大事</h3>
<div style="padding-left: 15px;">
 自分がよく 
 「出来ると思っていれば出来る。出来ないと思っていたら出来ない」 
 と言うことを言います。
 とある有名な小説家の体験談で言うと
<blockquote> 「私が運が良いのは『私は運が良いと思っている』からなんだ」</blockquote>
 というものに近いです。
 「結果」を確信していると勝手にそこにたどり着くし 
 「結果」を信じていなければ、途中で無意識に 
 「そうならなくても良いかも」「諦めよう」と道をそれることで「結果」に辿り着かないという理論だと思います。
 そのためには 
 「意志」ではなく「意思」が大事なのではないでしょうか。
 何か達成したり成功するのはただ単純に 
 ゴールと今現在を結ぶ、という認識と状況の変化だけではないのでしょうか。
</div>

Company

Our Solutions

Support

News

Blog

Blogブログ

カテゴリーから探す

年別から見る

記事一覧 - カテゴリー: 開発ナレッジ

2021/06/30

2021/06/05

2021/06/04

2021/05/14

2021/05/14

2021/05/14

2021/04/03

2021/04/03

2021/04/02

2021/03/06

2021/03/03

2021/02/06

2021/02/06

2021/01/09

2021/01/08

2020/12/05

2020/12/04

2020/12/04