2022年6月26日 日曜日 23:38

【動画作成ソフト】動画作成におすすめ!After Effectsの魅力!

【動画作成ソフト】動画作成におすすめ!After Effectsの魅力!

皆様こんにちは。リラ吉です。

最近YouTubeで動画を見ていたのですが、思えばここ数年で動画投稿者が増えましたね。嬉しい限りです。

実は私も一時期動画作成をやっていましたが、残念ながらあまり良い動画、レベルの高い動画が作れなくて結局やめてしまいました。

ただその時色々ソフトを試しました。今回の記事では試した中でも最もよかったものを紹介したいと思います。

「大した動画作れなかった奴の話なんか参考にならない」と思われる方もいらっしゃると思いますが、もしご参考になったら幸いです。

おすすめソフト

私がおすすめするのはAdobe社が出しているAfter Effectsです。

理由としては下記2点です。

・初心者でもかっこいい動画が作れる

・技術力が上がれば大抵のものは作れる

この2点についてお話していきます。

 

初心者でもかっこいい動画が作れる

まず「初心者でもかっこいい動画が作れる」については私のような初心者でも下のレベルのものは作れます。

 

 

BGMをつけていないサンプルですが、ちょっとやればこのくらいの動画は作れます。

「私は人気YouTuberを目指すんだ!」「プロの動画編集者になるんだ!」という人には不十分なクオリティですが、簡単な物(例えば誕生日おめでとう動画)を作って知り合いに送るものとしてはちょうどいいレベルです。

プライバシーの問題もあり、ここでその動画をお見せすることは出来ませんが、結婚式の披露宴で流すくらいのものも一応初心者でも作れます。

余談ですが、披露宴用の動画は納期が短い場合、引き受けるのはおすすめはしません。私は先輩の披露宴用の納期1週間で作ったことがありましたが、毎日仕事から帰ってきてから夜中まで作業していました。ちなみに無償です。

お世話になった先輩のためとはいえ、納期1週間は二度とやりたくないです。せめて2~3週間欲しかった。

これ以上、私のような被害者が出ないことを祈ります。

少し話が逸れましたがAfter Effectsではこのような動画が作れます。もちろん他のソフトでも動画は作れますが、私がAftrer Effectsをおすすめするのは短時間の勉強である程度は作れるからです。

例えばある人がAfter Effectsについて10時間学んだとします。そして他のソフトについても10時間学んだとします。この人が両方のソフトで動画を作った際、おそらくAfter Effectsで作った動画のほうがクオリティは高いと思います。

もちろん人によって結果は変わるので、絶対とは言えませんけどね。

技術力が上がれば大抵のものは作れる

2つ目の「技術力が上がれば大抵のものは作れる」については簡単に説明が出来ます。

皆様は新海誠監督の「天気の子」という映画をご存知でしょうか。私もこの映画は観ましたが、新海誠監督の作品らしく、映像が非常にきれいな作品でした。

この天気の子にはAfter Effectsは使用されております(もちろん他のソフトも使用されていますが)。ちなみにソースはこちらです。

そのほかにも製作者のインタビュー等がなかったので、100%そうとは言えませんが、「アヴェンジャーズシリーズ」や「スター・ウォーズ/フォースの覚醒」でも使われたらしいですね。

これらの作品名からわかる通り、プロが使えば化け物クオリティのものが出来ます。

もちろん彼らはプロ。趣味レベルで追いつけるものではありません。ただ逆に言えば、趣味レベルで動画作成をやっている人が「ソフトのクオリティのせいで作れない」という壁にぶち当たることはありません。

どんなソフトにも出来ることと出来ないことがあります。ただ趣味で動画作成をしたい人が天気の子やアヴェンジャーズより高いレベルのもの、彼らがソフトの限界を理由にできなかったレベルのものを作ろうと思うでしょうか?

おそらく思いません。なので私たち趣味レベルの動画作成者が想像することは技術力さえあれば、ほぼAfter Effectsでは出来るということです。

さらにソフトの可能性を広げるプラグインというものもありますが、そこは機会があればお話ししようかと思います。

 

欠点

そんなAfter Effectsにも欠点はあります。

それは「お金がかかること」です。

After Effectsは無料ではありません。税込で1,848円/月です(7日間の無料期間はあります)。

高いと感じるか安いと感じるかは人それぞれですが、いずれにせよお金がかかるということは、沢山使わないとないともったいないということです。

なので「これから動画作成・編集をたくさんやるんだ」という方にはいいかと思いますが、「1本だけ作る」という方は、その動画を1,848円払って作る必要があるか一度考えてから使うか決めることをおすすめします。

ちなみに使わないときは契約しないという方法もありです。私も動画作成をやめていた時期は契約していませんでした。最近必要になって契約しなおしました。こういう使い方もできます。

ちなみに無料で作りたい方にはAviutlをおすすめしています。Aftrer Effectsほどのものは作れませんが、無料とは思えないほどのクオリティで作れます。

あとは強いて言うならですが、長い動画には向いていないということ。

数分~10分くらいならいいですが、それ以上の動画を作成するなら他のソフト(おすすめはPremiere Pro)と一緒に使うほうがいいかと思います。

After Effectsは映像に対して様々なエフェクト(雨を降らせたり、建物を爆発させたり)を加える(重ねる)のに特化しています。イメージとしては一つ一つの場面が凝っている動画ですね。

しかしその凝った場面を作るのに特化していても、その凝った場面を繋げるのには特化していません(イメージでは太く短い動画の作成が得意)。

なので、長い動画を作る場合はAfter Effectsで短く凝った動画を沢山作って、ほかのソフトでその動画を繋げる必要が出てきます。

 

まとめ

以上がAftrer Effectsの説明になります。

結論を言うと、有料でもいいから初心者でもかっこいい動画が作りたいという方がもしいらっしゃいましたら、Aftrer Effectsを検討していてもいいかと思います。

ただ出来る限りコストをかけたくないという方は無料のソフトでも全然良いかと思います。クオリティ高い無料ソフトもたくさんありますから。

短く、重要な場面や動画のOPやEDをAftrer Effectsで作り、そのほかの場面の作成やOPやEDを本編と繋げるのは無料ソフトで行うという方法もありです。

ちなみに私が動画作成をやっていた際は撮影した動画を10分割していました。30分撮影したなら3分の動画が10個あるような状態ですね。

その3分の動画をAftrer Effectsで編集し、最後に別ソフトで繋げて30分の動画にしていました。多分長い動画を作る際は無難な方法だと思います。

あと一応目安としてたまにYouTubeで見かける「動画を撮影(録画)し、余分な部分を切り取り、動画上に文字や画像を入れ、ちょっとしたエフェクトをかける(例:文字や画像を震えさせる、文字や画像が砕け散るなど)」くらいの編集であれば無料ソフトで問題ありません。

それ以上のことがしたければAfter Effectsをはじめとする有料ソフトというイメージです。この記事の最初にもリンクは貼りましたが、After Effectsのホームページに出来ることが書かれていますので、ご参考にしていただけましたら幸いです。

今回は以上です。ここまで読んでいただきありがとうございました。

それではまた。

リラ吉

にほんブログ村 にほんブログ村へ

関連記事

【2022年来日公演版】Larry Carlton(ラリー・カールトン)の使用機材

世界的に有名なギタリストLarry Carlton(ラリー・カールトン)氏。 今回の記事では2022年の横浜公演のセカンドステージで使用したギター・アンプ・エフェクターを紹介いたします。 使用ギター 彼の代名詞といえばGibson ES-335ですが、近年使用しているのはパートナーシップを結び開発したSire H7です。カラーはCherry Sunburstでした。 ご本人が使用しているものは特注モデルかもしれませんが、私達が手に入れられるモデルの新品価格はデジマートさんを見る限り9万3500円です。Gibson ES-335よりは手に入れやすい価格になっております。 使用アンプ アンプはダンブル系のアンプとして有名なBludotone(ブルードトーン)を使用していました。 以前のインタビューで「Bludotoneのアンプはブリュッセルと東京にもあって、ヨーロッパと日本でツアーする時はアメリカから空輸しなくていいんだ」と言っておりましたので、このアンプは「日本に置いてあるアンプ」なのかもしれません(ただ昔のインタビューなので今は日本にないかもしれません)。 (adsbygoogle = window.adsbygoogle || ).push({}); 使用エフェクター・パワーサプライ エフェクターは下記のものを使用しておりました。 BOSS FV-30H/L(ボリュームペダル)Vox Wah(ワウ) ※V847かモディファイされたものか不明Blueline Overdrive(オーバードライブ)Providence CHRONO DELAY DLY-4(ディレイ)FREE THE...

【ピンズ】かわいいハードロックカフェのピンバッチの魅力とコレクションを紹介

皆様こんにちは。リラ吉です。 よく趣味は何ですか?と聞くと「〇〇を集めるのが趣味です」と返ってくることがあります。皆様には何かを集める、コレクションする趣味はあるでしょうか? 人によってはフィギュアだったり、カードだったりしますね。 私にも集めているものが3つあります。1つはキャラクターグッズ(ディズニー、ミッフィー、リラックマ、コウペンちゃんなどのグッズ)、2つ目が音楽機材です。音楽機材のコレクションについては以前の記事でも書きました。 そして3つ目がハードロックカフェ(Hard Rock Cafe)のピンバッチです。 今回はこのハードロックカフェのピンバッチについて書きたいと思います。 ハードロックカフェのピンバッチとは ハードロックカフェのピンバッチはハードロックカフェとハードロックホテルで売られているピンバッチです。 Wikipediaには「Rock Shopで入手できるグッズの中でも、群を抜いて人気があるのがピンバッジである。「ピンヘッド」と称されるピンコレクターは世界各国(店舗がない国も含む)に数万人おり、米国、欧州などには各地域にコレクタークラブなどが多く存在する。」と書かれています。 そんな人気のピンバッチですが、世界中の各店舗で異なるデザインのものを販売しております。しかもデザインは毎シーズン変わります。 下の写真を見ればわかりやすいかと思いますが、下の写真を見るとビッグベンをモチーフにしたギターを横にしたピンバッチだということがわかり、「Hard Rock Cafe」と書かれたロゴの下に「London」と書かれています。 これは当然ロンドン店で売られているものです。東京店で売ったら「なんで?」ってなりますからね。このようにロンドン店ではロンドン店オリジナルデザイン、東京店では東京店オリジナルのデザインのピンバッチが売っています(中には世界中で同じデザインのものもありますが基本は違うデザインです)。 売っているピンバッチのデザインは各店舗で異なりますが、よくあるのが各都市の街並みをイメージしたもの(下の例はオスロの街並み)     キャラクターとコラボしたもの   特定の時期を表現したもの   その都市の名物をイメージしたもの(下の例はベルギーワッフル)   その国の国旗、あるいは州旗をイメージしたもの(下の例はスウェーデン国旗)   その都市であったイベントをモチーフにしたもの(下の例はローマ教皇がフィラデルフィアを訪問を記念して作られたもの) このように各都市で様々なものが売られていますが、基本的には「かわいいデザイン」「ロックでかっこいいデザイン」「ちょっとお茶目なデザイン」のものになっています。   魅力 このピンバッチの魅力についてですが、下記の7つが魅力だと考えます。 毎シーズンデザインが違う自分の誕生月・星座のピンバッチがある好きなスポーツチームのバッチを購入できる場合があるキティちゃんコラボがかわいい自分が住んだ場所・旅をした場所の思い出になる自分に合った集め方が出来る世界中にコレクターさんがいる ではこの7つの魅力について説明していきます。   毎シーズンデザインが違う なぜおすすめなのかと言いますと、上記の通り、世界中の各店舗で異なるデザインのものを販売しております。そのデザインは毎シーズン変わります。 例えば下の画像の上段一番左は2013年のロンドンマラソンの時に購入できたピンバッチ、真ん中は2014年にラスベガスのハーロックホテルで購入できたピンバッチ、右は2015年のニューヨークヤンキースの開幕戦の時に購入できたピンバッチ、下段は2017年のニューヨークのニューイヤー時に購入できたピンバッチというように特定の時期しか買えません。    こういったものは他にはなかなかありません。他のピンバッチも世界中で売られていますが、作っているメーカも違えば、売っているお店も違いますし、毎年、毎シーズン同じようなものが売られています。特定の時期しか買えないものは少ないです。   自分の誕生月・星座のピンバッチがある ピンバッチには下の写真のような月、星座のデザインのものもあります。自分や大切な人の誕生月や星座を集めることも出来ますし、12ヶ月・12星座すべてを集めるなんてことも出来ます。   好きなスポーツチームのバッチを購入できる場合がある これはすべてのチームというわけにはいきませんが、ハードロックカフェと提携しているリーグ・チームであれば購入することが出来ます。 例えば下の写真の上段左と中央はNBAのチームのグリズリーズとセルティックス、右は阪神タイガース。下段左はレッドソックス(しかも昔のユニフォームデザイン)、右はヤンキースといった感じです。好きなチームのものがあれば嬉しいですよね。   キティちゃんコラボがかわいい ハードロックカフェにはキティちゃんコラボのピンバッチがあります。これが非常にかわいいデザインです。中にはこのキティちゃんコラボのピンバッチだけを集めるコレクターもいるくらいです。   自分が住んだ場所・旅をした場所の思い出になる これはほかのピンバッチやグッズにも同じことがいえるので大きな魅力ではありませんが、実際にその国、その都市に行き、訪れた店舗で購入している人は思い出になります。 例えば下の写真はコペンハーゲンのピンバッチですが、これは人魚姫をモチーフにしています。コペンハーゲンにはアンデルセンの作品「人魚姫」の像があるのですが、この像を見て、その後このピンバッチを買うといい思い出になるのではないかと思います。   自分に合った集め方が出来る 集め方もいろいろあり、自分に合った集め方が出来ます。 私は実際にその国、その都市に行き、訪れた店舗で購入します。その方が思い出になるからです。例外は2つのみです。一つはバグダット、もう一つはバリです。どちらもお土産でもらいました。 コレクターの方の中にはオークションや通販等を通して買う方や同じコレクターの方とトレードしながら集める私とは違った集め方もいらっしゃいます。 あとは特定のものだけ買うということも出来ます。例えば毎年春に発売される桜をモチーフにしたピンバッチだけ買うなどです。 このように自分の好みに合った集め方が出来るのも魅力ですね。   世界中にコレクターさんがいる このピンバッチですが、世界中にコレクターさんがいます。 日本にももちろんコレクターさんはいて、この記事を書いている段階では新型コロナウィルスの影響で開催は不可能ですが、定期的にハードロックカフェ主催の交流会も開催されています。 行ってみると何百種類に集めた方もいれば、2,3個持っていてまさに今から集め始めるなんて方もいらっしゃいます。そういった交流会で他のコレクターさんと会えるのも魅力の一つですね。 魅力については以上になります。   私のコレクション このハードロックカフェのピンバッチを私は集めているわけですが、下の写真が私の所有するピンバッチです(画像をクリックすると拡大されます)。 自分で言うのもあれですが、なかなかの量かと思います。ハードロックカフェの店員さんは首掛けのネームホルダーにピンバッチをつけていますが、その量と同等くらいはあると思います。 もちろん本当にすごいコレクターさんと比べてしまうと足元にも及びませんが、今後も集め、すごいコレクターさんの仲間入りでいるようにしていきたいです。   まとめ 以上がハードロックカフェのピンバッチになります。 7つの様々な魅力があり、世界中にコレクターさんもいらっしゃるので、コミュニケーションの方法の一つになるかもしれません。 集め方もいろいろありますので、もしご興味も持った方がいらっしゃいましたら、ぜひ集めてコレクターさんの仲間入りをしていただけたら嬉しいです。 今回は以上です。それではまた。 リラ吉

【機材紹介】レアなJohn English作のマスタービルダーモデルも!?所有ギターを紹介さます!

皆様こんにちは。リラ吉です。 今回の記事では私の趣味であるギターについて書きたいと思います。 具体的には所有ギターについてです。 ギター好きの方は「こういうの使ってるんだ」、ギターのことがよくわからない方は「こんなギターがあるんだ。私もやってみたい」と思っていただけましたら幸いです。 ではご紹介していきます。 Fender Custom Shop 50th Anniversary 55 Stratocaster Masterbuilt By John English Fender Custom Shopのストラトキャスターです。 作ったのは伝説のマスタービルダーの故ジョン・イングリッシュ(John English)氏です。 マスタービルダーとはFender社の中でも特に優れたギタービルダーに与えられる称号です。 Wikipediaには 「マスター・ビルダーが、1人で木材の選定〜加工〜組み立てまでの全てを行う特別な行程と、その方法で製作されたモデル。製品名の中に製作したマスター・ビルダーの名前が入れられた形で発売されているため、ビルダー毎の楽器特性を選ぶ事も出来る。特にジョン・イングリッシュ制作のギターは、初期のフェンダー社製品と寸分違わぬ出来上がりのため、非常に人気がある。」 と書かれています。 このギターは名工によって作られ、しかもその方はもう亡くなられてるということもあり、非常に貴重なモデルです。おそらく死ぬまで手放さないでしょう。 そんな大事なギターですが、音はベルトーンと呼ばれる鈴のような音です。 コーラスのエフェクターと一緒に使うとEric Johnsonのような美しい音になります。 改造等は一切していないオリジナルです。 ピックアップは1950年代からFendereでピックアップを作り続けた伝説のピックアップ職人アビゲイル・イバラ女史作成のものです。 私の所有ギターでは最強の一本ですね。 Gibson Custom Shop 1959 Les Paul Reissue Gibson Custom Shopのレスポールです。 Gibson...
PVアクセスランキング にほんブログ村

返事を書く

Please enter your comment!
Please enter your name here

最新記事

【2022年来日公演版】Larry Carlton(ラリー・カールトン)の使用機材

世界的に有名なギタリストLarry Carlton(ラリー・カールトン)氏。 今回の記事では2022年の横浜公演のセカンドステージで使用したギター・アンプ・エフェクターを紹介いたします。 使用ギター 彼の代名詞といえばGibson ES-335ですが、近年使用しているのはパートナーシップを結び開発したSire H7です。カラーはCherry Sunburstでした。 ご本人が使用しているものは特注モデルかもしれませんが、私達が手に入れられるモデルの新品価格はデジマートさんを見る限り9万3500円です。Gibson ES-335よりは手に入れやすい価格になっております。 使用アンプ アンプはダンブル系のアンプとして有名なBludotone(ブルードトーン)を使用していました。 以前のインタビューで「Bludotoneのアンプはブリュッセルと東京にもあって、ヨーロッパと日本でツアーする時はアメリカから空輸しなくていいんだ」と言っておりましたので、このアンプは「日本に置いてあるアンプ」なのかもしれません(ただ昔のインタビューなので今は日本にないかもしれません)。 (adsbygoogle = window.adsbygoogle || ).push({}); 使用エフェクター・パワーサプライ エフェクターは下記のものを使用しておりました。 BOSS FV-30H/L(ボリュームペダル)Vox Wah(ワウ) ※V847かモディファイされたものか不明Blueline Overdrive(オーバードライブ)Providence CHRONO DELAY DLY-4(ディレイ)FREE THE...

【プログラミング初心者向け】計算機アプリを作ってみよう Part3(Grid作成編)

※この記事ではC#とWPFを使用してアプリを作成しております。MacOSではWPFを使用できませんので、その点はご了承ください。 皆様こんにちは。リラ吉です。 前回は計算機アプリのスタイルを作成しました。今回もUI部分(レイアウト)を作成していきます。 本記事では背景色の変更とGridの作成まで行います。 背景色の変更 まず背景色の変更をします。現在は下の画像のように計算機の背景は真っ白だと思います。これを変更していきます。 やることは前回作ったMainWindow.xamlの</Window.Resources>の下に下記コードを書いていきます。 <Window.Background> <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> <GradientStop Color="#F9F6EF" Offset="0"/> ...

【プログラミング初心者向け】C#・WPFで計算機アプリを作ってみよう Part2(スタイル作成編)

※本記事はプログラミング初心者向けです。これまでにアプリを作ったことがある、プログラミングをしたことがある方にはレベルが低すぎるのでご了承ください。 皆様こんにちは。リラ吉です。 前回は計算機アプリの設計をしました。今回から設計を元にUI部分(レイアウト)を作成していきます。 本記事ではVisual Studioを起動し、スタイルを作るところまで行います。 Visual Studioの起動 まずはPart0でインストールしたVisual Studioを起動します。起動したら「新しいプロジェクトの作成」をクリックします。 新しいプロジェクトの作成画面が表示されたら検索ボックスに「wpf」と入力して検索、検索結果の中から「WPF アプリケーション」を選択します。この時、下の画像のようにC#のものを選択してください。 WPFとは簡単に言えば「UIがあるアプリケーションを作ることのできるもの」になります。UIの定義はかなり広いものではありますが、ここでいうUIは「使用者とプログラムをつなぐ画面」になります。 計算機の場合は計算機画面というUIがあって、使用者がボタンを押すと計算をするプログラムが動くことになります。WPFではこのUI、つまり計算機の画面を作ることが出来るということです。 話を戻して。「WPF アプリケーション」を選択出来たら「次へ」を押して、プロジェクト名を入力します。今回は「Calc」にしました。「場所」についてはデフォルトのままで大丈夫です。入力出来たら「次へ」を押します。 追加情報画面に遷移したらデフォルト設定のまま「作成」を押します。 「作成」を押すと下の画像のような画面が表示され、プロジェクトが作成されます。これでプログラムを書く準備が出来ました。 現在プログラムを書く場所とUIを表示する場所上下に分かれています。上の画像の白い四角形部分がUIを表示する場所、その下のプログラムが書いてある四角い欄が見た目通りプログラムを書く場所です。 この状態だとプログラムを書く欄が小さすぎて書きずらいと感じる方がいらっしゃるかもしれません。 そのように感じた方は下の画像のボタンをクリックし、 プログラムを書く画面とUIを表示する画面を分けても良いかと思います。もし同じ画面でいいよという方はクリックしなく点も大丈夫です。 クリックしたら今後は画面左下の「デザイン」「XAML」でUIとプログラムを書く画面を行き来できるようになります。今回はこのように画面を行き来しながら作っていきます。 サイズを変更する 次にUIのサイズと名前を変更してみます。現在はアプリケーションが横長でMainWindowという名前になっています。 これを設計した計算機と同じで縦長で名前も違うので変更していきます。 変更はMainWindow.xamlのXAMLをクリックし、プログラムを書く画面に遷移させ、TitleとHeight、Widthを変更します。下の画像の部分ですね。 今回は下記のように変更しました。 Title="Karl Claytor" Height="700" Width="500" > 解説をするとTitleはアプリケーション名になります。今回は「Karl Claytor(Calculatorをもじった名前)」にしました。 そしてHeight(縦)を700pixel、Width(横)を500pixelにしました。 アプリケーション名はお好きなものをつけていただいて大丈夫です。サイズに関してもご自分でいい感じと思えるものを設定していただいて大丈夫です。 この状態でデザインを見ると縦長になって、左上を見ると名前も変わっていることが確認できます。これでサイズ変更は完了です。 スタイルの作成 次にスタイルを作っていきます。スタイルとは文字や背景の色はもちろん、カーソルを当てたときの動作などの設定です。つまり基本となるデザインですね。 直接MainWindow.xamlにスタイルを書いても良いのですが、今回はスタイル用のxaml(ControlStyle.xamlというファイルにします)を作成します。 ちなみxamlは簡単に言うとUI関係(表示や操作)に関わる部分を書く場所です。MainWindow.xamlはアプリケーション本体(今回の場合は計算機本体)のUIに関するプログラムを書く場所になります。 今回、直接MainWindow.xamlにスタイルを書かない理由は今後他のプログラムを書く際にそのスタイルを書いたファイルを流用できるからです。 他のアプリケーションを開発する際に今回作ったファイルをコピーしてきて流用し、使用したいスタイルがファイル内にあればそれを使い、なければ新しく追記して開発、次のアプリケーション開発でもファイルを流用し、ということが可能になります(ただファイルに記述したスタイルが膨大になるとアプリケーションが遅くなることがあるので注意)。 どういうことかといいますと、例えば今回の計算機アプリの開発ではボタンのスタイル(デザイン)を作ります。その後皆様がエレベーターをシミュレーションしたアプリを作るとします。その時に そういえば計算機を作った時にボタンのスタイル(デザイン)作ったな。よし、次に作るエレベーターのシミュレーションアプリのボタンは計算機アプリで作ったControlStyle.xamlをコピーしてきて同じスタイルを使おう ということが出来るということです。 では早速スタイルを作っていきます。 まずはソリューションエクスプローラーの「Calc」の上で右クリック、追加→新しいフォルダを選択します。この時のフォルダ名は「Resources」にします。 今度は作成した「Resourcesフォルダ」の上で右クリックし、同様にフォルダを作成します。今度はフォルダ名を「Styles」にします。現在、下の画像のようになっているかと思います。 今度はStylesの上で右クリックして追加→新しい項目を押します。 遷移したら「リソース ディクショナリ(WPF)」をクリック、ファイル名を「ControlStyle」にして「追加」を押します。「追加」を押す前は下の画像の状態になっているはずです。 「追加」を押すとStylesの下にControlStyle.xamlが作成されます。ここにスタイルを書いていきます。 ControlStyle.xamlをクリックすると、下の画像の画面が表示されます。この記事の最初にやったようにプログラムを書く画面とUIを表示する画面を分けていきます。 分けたら「XAML」にプログラムを書いていきます。「デザイン」が選択されている方は「XAML」を押してプログラムを記述する画面に遷移させます。 遷移したらスタイルを書いていきます。スタイルの内容は下記の通りです。 <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" ...

【プログラミング初心者向け】C#・WPFで計算機アプリを作ってみようPart1(設計編)

※本記事はプログラミング初心者向けです。これまでにアプリを作ったことがある、プログラミングをしたことがある方にはレベルが低すぎるのでご了承ください。 皆様こんにちは。リラ吉です。 今回の記事から数パートに分けて、初心者の初心者による初心者のためのプログラミング講座をしたいと思います。 使用する言語はC#でレベルとしては初心者による初心者向けの記事なので、数時間程度で出来るようなものになっていますのでご了承ください。 C#を使用した理由は簡単にUI(表示、操作処理など)を開発できるWPFが使用できるからです。 開発環境は「Visual Studio」 をこの記事では使用します。 「Visual Studio」 のインストール方法については過去の記事をご参照ください。 ただMacOSをお使いの方は裏技はありますが、基本的にはWPFでは開発出来ませんのでご了承ください。 今回作るのは「計算機」です。動作がイメージし易いので設計、テストがしやすいのが選んだ理由です。 最終的な完成イメージは下図のようになります。 今回の記事では実際にプログラムを書く前に簡単に設計をしていきます。 計算機は複雑な内容・処理ではないので、正直設計する必要があるかは微妙なラインではありますが、設計は大事なことですし、時間をかけない程度にやっていきます。 クラス図 かなり適当ですが、クラス図は下図のようになります。 内容を解説すると、計算機を作るうえで大まかに9つのクラスを用意しました。 MainWindow MainWindowはUI(=実際に使う人が見る計算機の画面)にデータを渡す、またUIから渡されたデータをMainWindowModelに渡す役割のクラスです。 MainWindowModel MainWindowModel は MainWindowとDataManagerに「こういう値が来たよ」「こんな風に値が変わったよ」と伝える役割のクラスです。 DataManager DataManagerはMainWindowModelから受け取ったものが一体何なのか、その後どういう処理をすべきか判断している場所です。実はここが一番重要です。 例えば「1」と入力したあと、「.」と入力したらどうなるでしょうか?当然ですが「1」の後ろに「.」をつけて「1.」という小数になります。なのでDataManagerには「1.」になるように判断させます。 しかしこのあとにもう一度「.」を押したらどうなるでしょうか? 私たち人間は「1..」のように小数点の後ろに小数点がないことはわかっていますが、コンピューターはそうはいきません。 こうならないようにDataManagerには「小数点の後に小数点が入力されたらダメ」と判断させなければなりません。 ただこれを聞いてプログラミング経験のある方は それって文字型にしているからであって、数値型(double型など)なら小数点の後ろに小数点が来ないようにするとか考える必要ないんじゃない? そう思われた方もいらっしゃるでしょう。 double型でも問題ありません。というかdouble型のほうが上手くいくかもしれません。 ただ今回は入力した数字や計算結果、数式を表示する場所をTextBlockにしました。 TextBlockのプロパティのTextは文字通りテキストなので、入力した数字等をstring型にして、それをバインドするという設計にしました。 これはどちらが正しいとかでなく、好みの問題になってくるかと思います。 また、DataManagerは下記のクラスとも繋がっています。 CalcStatus CalcStatusはステータス(=今の状況・状態)の列挙型(enum)が書いてある場所です。 計算機にはステータスが必要です。数字を入れた後は「数字を入れた後」という状況になります。 演算子を入れた後は「演算子を入れた後」という状況です。 しかし、プログラミングではステータスのようなものは数字で表されます。 今回作る電卓で言えば0がクリアした後、1が数字を入れ後、2が演算子を入れた後といった感じです。 数字で表しても良いのですが、数字だと作った本人はわかっても、他の人がプログラムを見たとき「ステータスが0ってどういうこと?何を表してるの?」となってしまいます。 クリアした後であれば「ステータスは0」と書くより「ステータスはAfterClear」といった感じで表すほうがわかりやすいです。 これが出来るのが列挙型です。列挙型を使用することで、内部的な処理は数字ですが、私達が見る部分においてはステータスを数字ではなく文字で表すことができます。 Operator 演算子の列挙型が書いてあるクラスです。 CalcOption 二乗や平方根、±のような特殊な計算の列挙型が書いてあるクラスです。 DataStore 値を格納し、計算するクラスです。 NumberButton 数字ボタンを定義しているクラスです。 OperatorButton 演算子ボタンを定義しているクラスです。 これらがこの計算機アプリケーションのクラスになります。この設計をもとに次回の記事からプログラムを書いていきます。 シーケンス図 シーケンス図についても簡単に書いていきます。今回は「数字ボタンを押したとき」「演算子ボタンを押したとき」の2ケースを書きました。 「数字ボタンを押したとき」演算子ボタンを押したとき」 もステータス (=今の状況) によって動作は変わります。 なにも入力されていない状況だと、基本的には数字ボタンを押したときは押された数字をためて(キャッシュして)いき、演算子ボタンを押された際にその数字を一つ目の数字として確定させます。 例えば何も押していない状況で「1」と入力したら「1」がキャッシュされます。もう一度「1」を押すと「11」がキャッシュされます。 その後「+」を押したら「11」という数字が一つ目の数字として確定されるという作りです。 演算子を入力された状態で演算子ボタンを押すと演算子が変わります。 演算子が入力されている状況で数字ボタンを押すと演算子が確定され、数字をためて(キャッシュして) します。 最後に=を押したら数字が二つ目の数字として確定され計算が行われます。 というように書いてもわかりづらいと思うの、例を挙げると、1→2→+→-→3→4→=という順番で押していくと下記のようになります。 ①1が押され1がキャッシュされる ②2が押され、キャッシュされていた数字の末尾(1の後ろ)に2を追加(キャッシュされている値が12になる) ③+が押され、12という値が一つ目の数字として確定される ④-が押され、演算子が+だったのが-になる ⑤3が押され、-が演算子として確定され、3がキャッシュされる ⑥4が押され、キャッシュされていた数字の末尾(3の後ろ)に4を追加(キャッシュされている値が34になる) ⑦=が押され、34という数字が二つ目の数字として確定、一つ目の数字(12)、演算子(-)、二つ目の数字(34)による計算が行われる という流れになります。 実際の実装では制御も入るのでもう少し複雑にはなりますが、基本的にはこの流れになります。 ここまでが計算機アプリの基本的な設計になります。 設計は文字で説明するのが難しいので、もしわかりずらかったら申し訳ございません。 次の記事からVisual StudioでUIを作っていきます。 今回は以上です。それではまた。 リラ吉 https://rira-blog.com/%e3%80%90%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0%e5%88%9d%e5%bf%83%e8%80%85%e5%90%91%e3%81%91%e3%80%91%e8%a8%88%e7%ae%97%e6%a9%9f%e3%82%a2%e3%83%97%e3%83%aa%e3%82%92%e4%bd%9c/

【プログラミング初心者向け】C#・WPFで計算機アプリを作ってみようPart0(Visual Studio Community 2019のインストール)

皆様こんにちは。リラ吉です。 今回の記事ではプログラミングをする上で便利な統合開発環境「Visual Studio」のダウンロードとインストールの方法をご紹介します。 ご参考になれば幸いです。 Visual Studioのダウンロード Visual StudioをダウンロードするにはこちらのURLにアクセスします アクセスすると下の画像の画面が表示されまので、赤枠で囲った「無料ダウンロード」をクリックします。 無料ダウンロードをクリックすると下の画像の画面に遷移してダウンロードが始まります。もしダウンロードが始まらないようでしたら、画面上部の「こちらをクリックしてもう一度お試しください」をクリックしてダウンロードします。 問題なくダウンロード出来たらインストールしていきます。   Visual Studioのインストール ダインロードが完了したらインストールしていきます。ダウンロードしたファイルを開くと、インストーラーが開きますので、続行を押します。 少し待っていると何をインストールするのかを選択する画面が表示されますので、インストールしたいものにチェックを入れ、「インストールボタン」を押します。今回は「.NET デスクトップ開発」をインストールします。 インストールボタンをクリックするとインストールが開始されます。完了したらプログレスバーが消えます。これでインストールが完了です。 背景色を変更する ここからはオプションですが、よりプログラマーらしくするため、そして目を少しでも疲れさせないために背景色を変更してみましょう。 Visual Studioを開くとウィンドウが表示されます。今回はただの設定ですので右下に青字で書いてある「コードなしで続行(W)」をクリックします。 下の画像の画面が表示されますので、ツール→オプションをクリックします。 オプションを開いたら環境→全般をクリックし「配色テーマ」を「濃色」に変更してOKを押します。 背景が黒くなったら変更完了です。背景を黒くする理由は「プログラマーらしくてかっこいいから」「白よりも目に優しいから」です。 1日に何時間もプログラムを書いていると、どうしても目が疲れてきます。なのでほんの少しでも目に負担をかけないような色にすると良いかと思います。 以上がVisual Studioのダウンロード、インストール方法になります。 開発するうえで非常に役立つツールなので、ぜひ活用していただけたらと思います。 今回は以上です。それではまた。 リラ吉