dandelionS Blog

技術者ブログとして日ごろ取り組んでいる学習内容をご紹介します。
今回はＷＥＢデザインをテーマにしている第0ユニットです。

今回のテーマは「CMS」について深堀していきたいと思います。

過去の技術者ブログで「WordPress」をご紹介しましたが、WordPressもCMSの一つになります。

CMSとは…
「Contents Management System：コンテンツ・マネジメント・システム」の略となり、web制作に必要な専門的な知識が無くても、WEBサイトやコンテンツを構築・管理・更新できるシステムとなります。

例えば、今読んでいただいているダンデライオンズのブログ。
これもCMSのWordpressを使用しております。

テンプレートを選んで、画像を選択するだけで皆さんに見ていただいている画面とブログを書いたり管理したりする画面を簡単に作ることができます。
実際に、このブログも30分もかからずに作ることができました。
上の画像の矢印ボタンや右下にある検索もついてきます。
我々SEが実際に1から作ると、画面を作成して、各機能を作って…となるためCMSで作る時間よりも何倍以上の時間が掛かってしまいます。

また、本来であればWEBサイトを構築しようとすると、HTMLやCSS、javascriptといった技術が必要となりますが、CMSを使うことで上記技術がなくても構築することができます。
また、簡単に更新ができること、インターネット環境があれば構築ができることなどがメリットとして挙げられます。

2021年時点で世界で一番使われているCMSは「WordPress」で全体の約40%を占めています。そのほかのCMSは数パーセントと断トツで「WordPress」が使われていることが分かります。

さてそんなCMSですが、少し前から「ヘッドレスCMS」という言葉が注目されております。

ヘッドレスCMSとは…
ヘッドレスの「ヘッド」は表示する画面(ビュー)のことを言い、表示する画面がないCMSということになります。
表示する画面を用意してくれないので、自分で用意する必要があります。

ヘッドレスCMSの代表的なメリットはデザインの自由度が上がること、表示速度が上がるなどが挙げられます。

デザインの自由度が上がるとは、通常のCMSでは表示する画面も用意してくれますが、微妙な位置調整などは簡単にはできません。変えられると言ったら画像やフォントのみとなりデザインは固定されてしまうためこだわりたいところはこだわれない、痒い所に手が届かないことがあります。
ヘッドレスCMSでは、自分たちで表示する画面を用意するため好きなようにデザインすることができるため満足のいくデザインで作成することができます。

次に表示速度が上がると書きましたが、皆さんはネットを見ていて画面がすぐ表示されないとイライラしませんか？今は何でもネット経由で行えますが、表示速度が速いのはもう当たり前になってきていると思います。
そんな中、通常のCMSでは表示される画面を毎回生成しているため表示に時間が掛かってしまいます。
ヘッドレスCMSは画面を作っておき、存在するファイルを表示するようになるため画面が早く表示されます。

上記メリットはありますが、通常のCMSとは違って自分たちで作成する必要があるのでHTMLやCSSの技術が必要となってきます。

ヘッドレスCMSで一番有名なのは「Contentful」です。
その他にも、日本で作られた「MicroCMS」やFacebookが開発したAPI「GraphQL」を活用した「GraphCMS」があります。

我々第0ユニットのようにWEBデザインの技術を持った人たちがやるのであれば「ヘッドレスCMS」を使っていくのもイイネ！と思いました。

次回の第0ユニットの技術者ブログもお楽しみに！

ダンデライオンズでは社員同士の親睦を深めるための「レクリエーション」を定期的に開催しています！
今回は、コロナの影響により会うことができないため
オンラインゲームを計画しました。
ゲームは、「Gartic PHONE（https://garticphone.com/ja）」です。

「Gartic PHONE」を簡単に説明すると、「お絵かき伝言ゲーム」です。
出されたお題の絵を書き、回答者が正解すれば成功！という流れですが・・・
実際にプレイしてみると、意外？全然？正解できません！（笑）
「なんでこうなった？」という場面ばかりで、それが面白くて、
爆笑してしまいます。
絵を書くだけの簡単なゲームなのに、最高に盛り上がれます！

みんなあまりわからない状態で、開始した初回は、
こんな感じで、絵に文字で説明してしまう人もいました(笑)

お題「本を破壊している馬」→「馬が壁にぶつかっていく」

時間を忘れてやっていたのですが、
その中でも、面白かった2つを紹介します。

お題「サンタみたいな教授」→「サンタ先生の数学授業」→「数学者のサンタクロース」

数学教授（大学）から、小学生？くらいに学力が落ちていくさまが面白い！！
絵がうまいほうがよいわけではないという例ですよね。

お題「エレベーターに乗るキリン」→「エレベーターを開けたら猿が乗ってきた」→「エレベーターに挟まれた泥だらけの人」→「エレベーターから出てくるムキムキマッチョマンの変態」

エレベーターの中の動物の変わりゆくさまが面白い！！
なんでそうなっちゃった？という流れが面白い！

・このゲームをやってわかっておすすめの点
　絵がうまくなくても面白く遊べる
　むしろ、正解しない方が面白い

おすすめですので、みなさんもやってみてください。
4人以上でやるほうが楽しいですね。

みなさんご協力ありがとうございました。
次回のレクリエーションもお楽しみに！

技術者ブログとして日ごろ取り組んでいる学習内容をご紹介します。
今回は、クラウドをテーマにしている第3ユニットです。
クラウドではないのですが、興味あるソフトを見つけたので紹介させてもらいます。

Cloud Commanderとは

WebDavのように、Webブラウザからファイルを操作できるようにするアプリケーションです。 画像などもブラウザ内でプレビューできます。また、遠隔でコンソール操作も可能です。

Cloud Commanderのインストール

Cloud Commanderはlinux上で動くアプリケーションです。curlコマンドでダウンロードとインストールを一括で行うことができます。Cloud Commanderはnodejsで動いているため、こちらもインストールする必要があります。これは、yumでインストールすることが可能です。

curl -SL https://rpm.nodesource.com/setup_7.x | bash –
yum install -y nodejs gcc-c++ make
npm i cloudcmd -g
npm i gritty -g

インストール完了後、以下のコマンドを実行することでCloud Commanderが起動します。

nohup cloudcmd –terminal –terminal-path “gritty –path here” –save &

ブラウザからアクセスする

この時点でリモートのクライアントからブラウザにアクセスすれば利用できる状態になっています。

あまり手間もかからずインストール可能で、手軽にファイルのアップロード、ダウンロードを行えるため、公開ファイルサーバとしても使えそうです。
色々なlinuxアプリケーションを見てきましたが、その中でも特にお勧め度が高いです。linuxを扱える人は良ければ試してみませんか？

今回の技術者ブログはこれで終了になります。
次回以降の記事もお楽しみに。

前回の勉強会の様子

社内勉強会 – 英会話レッスン(基礎の基礎) – dandelionS Blog

今回の勉強会では、AfterEffectsの基本の機能を使って動画を制作しました。
なお、AfterEffectsに触れたことのある『にっしー(私)』が先生を務めさせていただきました。

AfterEffectsとは

Adobe社が提供している映像編集ソフトです。基本的な動画編集はもちろん、CGなどで映像を加工したり、アニメーションをつけたりすることができます。
ちなみにAdobeの映像編集ソフトにはAfterEffectsの他に『Premiere Pro』というものがあり、そちらは長時間の動画(映画など)を制作するのに向いているソフトで、音に関しても詳細に編集することができます。

AfterEffects公式サイト

さすがに映画を製作するには時間が足りないので、今回はAfterEffectsを勉強会の題材にチョイスさせていただきました。

AfterEffectsで動画編集！

AfterEffectsは加工やアニメーションを得意としておりますが、参加者がほぼ初めて触れるということもあったため、ほかのフリー動画編集ソフトに対しても学んだことが活かせるように、『基本の編集方法』＋『AfterEffectsの基本技能』をメインで学んでいただきました。

『基本の編集方法』としては、動画を好きな部分でカットしたり繋げる、テキストを入れる、といった基本を実際に編集しながら感覚をつかんでいただきました。
加えて『AfterEffectsの基本技能』として、オブジェクト（動画やテキストなど）をフェードイン/フェードアウトさせたり任意の時間に合わせて動くように設定するなどを行いました。

勉強会後半は残りの時間を使って、一人一つ15秒ほどのCMのような動画を制作し、みんなで鑑賞しました。
実は、動画に使用してもらうための素材を事前にこちらで選抜したため、それぞれが使用した素材の中には他の人と被ってしまうものもありました…。しかし、製作者によって演出が異なったことにより、その素材が持つ雰囲気や意味合いが別のものになり、どの作品も参加者の個性が表れた動画になっていて面白かったです。

参加した社員の様子を見る限り、AfterEffectsでの編集の楽しさを知ってもらえた様だったので、とても嬉しいです。
AfterEffectsに興味を持った方は、ぜひお試しください。
ちなみに、次にAfterEffectsの勉強会を行う際は、もうワンランク上の「テキストアニメーション」を行なおうと考えています。お楽しみに！

＜動画は以下のサイトからダウンロードしました＞
https://mixkit.co/

技術者ブログとして日ごろ取り組んでいる学習内容を紹介します。
今回は、ローコード開発をテーマにしている第2ユニットです。

今回のテーマ『ローコードツールのトレンドについて』

まず初めに弊社ではOracle Application Express（APEX）を利用して、
社内システムを構築しておりますが、国内でのAPEXがどの程度導入されているのか？
今後も利用していくべきなのか？といった視点でトレンドを紹介し、どのローコードツールに着目していくかも選定していきたいと思います。

【APEXの国内での導入事例について】

APEXの成功導入事例の記事を参考にさせていただくと、２４事例紹介されているが日本の１事例しか挙げられておらず、海外での事例が多く挙げられているため、日本でのシェア率はそこまで高くないのでは？という印象を受けます。

また、APEXは部門単位の小規模アプリケーションの作成や、
業務の効率化に使う簡易アプリケーションの作成などで利用されることが多いため、案件というよりは、弊社と同様に社内システム管理として利用されることが多いのかな？と感じます。

【国内でのローコードツールのトレンドについて】

ITreviewにて、ローコードツールのトレンドを調べてみました。
※レビュー数と評価が高い上位3点を選出

・Claris FileMaker
固有の課題を解決するカスタムAppを迅速に開発するローコード開発プラットフォーム。
小さなチーム・大きなチーム、デバイスを問わずリアルタイムで安全に情報を共有でき、モバイル、コンピュータ、Web、オンプレミス、クラウドで動作させることができます。
35年以上の歴史があり、世界中で累計で2000万ライセンス以上の実績。

・OutSystems
アプリケーション開発を可視化し、既存のシステムと簡単に統合、必要であればカスタマイズされたコードを追加することができるローコード開発プラットフォーム。
様々なOSやデバイスでの利用に対応したアプリケーションの開発が行えるため、OSやデバイスの違いを開発者が意識しない。
開発ライフサイクル全体に対応しており、設計、コーディング、デプロイ、監視・管理の仕組みをトータルに提供。
グローバルで広く利用されており、国内でも110社以上の導入実績。

・PowerApps
マイクロソフトが提供するビジネスアプリケーション作成ツール。
PowerPointのような直観的な操作と、Excelのような関数を入力するだけでビジネスアプリケーションを作成可能。
数多くのデータソースに接続できることが特長でSharePoint、SQL Server、Office 365、Salesforceなどと接続してデータを取り込むことが可能。
IT業界を中心に、世界中の企業で導入・活用。

評価が高いツールとしてはやはり実績で選ばれている感じが強いですね。
3点のツールもローコード開発として提供している機能は同じような感じだが、
それぞれの特徴を生かしてどれを利用するかを考える必要があります。

【ローコードツールの選定にむけて】

トレンドや導入実績から見ても、APEXを導入している企業は少ないことがわかりました。
そのため、ローコードツールを生かして案件参画を検討しているのであれば、その他のツールに目を向ける必要がありそうです。

選定に向けて重要となってくる点として、
トヨタ自動車がOutsystemsを採用しており更なる展開を図っているという情報があり、中部地方でのOutsystemsの需要が高まってきている感じがします。
実際に何名か案件に携わったこともあり、中部地方の企業として非常に関係の深い話となりますので、今後はOutsystemsにも着目していこうと思います！

今回はトレンド紹介と今後のツールの選定について説明しましたので、
次回はOutsystemsではどのようなことができるのか等を紹介したいと思います。