信頼はずっと、挑戦はもっと。

お問い合わせ
TEL:03-3496-3888

BLOG コアテックの社員ブログ (毎週月曜~金曜更新中)

LIST OF ARTICLES

記事一覧

  • テクログ

    円形のプログレスバーを作成する [After Effects]

    最近制作したモーショングラフィックスで詰まったところがあったのでこの場を借りて知識を共有できたらと思います。やりたかったこと直線のバーではなく円形のプログレスバータイムラインに合わせて色付きのゲージを回転させたいゲージに合わせて真ん中の数字も動かしたい下2つがわからず詰まった。1.楕円形のシェイプを追加します。塗りは無しで線のみ。色は後で変えるので何色でもいいです。シェイプの下に平面をおいていますが、これはお好みで構いません。2.同様のシェイプレイヤーで一回り小さい楕円形パスを追加します。線のプロパティで破線を追加します。数値はお好みで。シェイプに塗りのエフェクトを適用してグレーに設定します。これがバーの下地になります。3.シェイプレイヤーを複製します。これが動きをつけるレイヤーになります。塗りのエフェクトは削除してとりあえずグラデーションを適用してデザインしておきます。4.ヌルオブジェクトを追加して、エフェクトのエクスプレッション制御からスライダー制御を適用します。スライダーをバーを動かしたい始点と終点にキーフレームを打っておきます。複製したシェイプレイヤーにパスのトリミングを追加します。終了点のエクスプレッションピックウィップをヌルオブジェクトのスライダー制御にドラッグしましょう。エクスプレッションが自動で入力されます。これでスライダーのキーフレームとシェイプの動きが同期します!プレビューするとバーが動くかと思います。とりあえずバーだけ出したい場合は上記で完成です。折角なのでバーの動きに合わせてパーセンテージも表示したいぜ!という場合は以下に…テキストレイヤーを配置します。テキストは円の中心に置きます。ソーステキストに下記のエクスプレッションを入力しますbeginCount =thisComp.layer("null").effect("スライダー制御")("スライダー"); stopCount = thisComp.layer("null").effect("スライダー制御")("スライダー"); beginTime = 0; countDur = 5; Math.round(linear(time,beginTime,beginTime + countDur,beginCount,stopCount)) + "%" beginCountとstopCountに先程のヌルオブジェクトのスライダープロパティを代入しています。beginTimeは名前の通り開始時間countDurはカウントする時間でこの場合5秒間ですlinear()のパラメータはlinear ( 変数(今回はコンポジションの時間) , 入力最小値 , 入力最大値 , minに対する出力値 , maxに対する出力値 ) ですので、スライダー制御の値に合わせて'%'がお尻についた1~100の数字が出力されるようになります。フォント、色、あとはスライダーのイーズをお好みで設定してみてください。完成形SVGにすればWebサイトやアプリとかでも使えるかな?こんな記事書いてますがデザイナーでもないので実務では一切触ってません。コアテックは映像案件があるわけではないのであしからず。。
  • テクログ

    Amazon Rekognition でサクッと画像解析する!

    皆さん、AWS使ってますか? 今回は 「Amazon Rekognition(レコグニション)」 を紹介したいと思います! 最近バズワードでなくなりつつある AI 系サービスです! 「画像や動画の分析を簡単な API で使っちゃおう!当然サーバレスで!」 みたいな感じです。 主な機能は、  ・画像内の物体、概念、シーンにラベルを付与 ・アダルトコンテンツかを検出 ・どんな顔をしているかを分析 ・有名人かどうかを判定 ・顔が似ている割合を確認 ・画像内のテキストを抽出 ・動画内の物体、人物などを検出 など多岐に渡ります。 料金も非常に安く環境の構築や運用も不要なので、気軽に試せるかと思います。 当社が管理しているサイトでは、ユーザーが画像や動画を投稿するコンテンツがあるので、それらを分析するロジックに活用できないか検討しているところです。 皆さんも是非お試しください! それではまた!
  • テクログ

    古いGitレポなんかにいられるか!私はCodeCommitにさせてもらう!

    この後すぐ、もしくは後半で藪の中とかで死んでるのが見つかるパターン。 …で、CodeCommitにしたいんです。CodeCommitじゃなくてもいいですが、旧Gitから新Gitへ変えたい。…だけどスパッと切り替えられないんだよねーなかなかねー。 …というときのために。新・旧Git両方にpush。です。 ひとことでいうなら『いま使っているレポジトリのリモートレポジトリ設定に新のURLを増やせばいい』ということです。 丁度使ってたSourceTreeの手順を書いてみますね。(1)旧レポジトリで、右上の「設定」を押します。(2)origin を選択して 「設定ファイルを編集」を押します。開くエディタを聞かれるので、開きます。 これが開いたファイルのイメージです。サンプルです。このファイルの、「pushurl」を2行にします(下に一緒にpushしたいレポジトリ指定を追加します)↓こんな感じになります。    編集後、保存してSourceTreeに戻って、pushテストをしてみましょう。新・旧両方に反映されていればOKです! スムーズに移行したい~
  • テクログ

    CloudFront で爆速サイトに!

     皆さん、AWS使ってますか? 今回は 「CloudFront(クラウドフロント)」 を紹介したいと思います! 巷で話題(?)のCDNでAWSが提供しているサービスです。 「全世界に分散配置されているエッジサーバにコンテンツをキャッシュして、アクセス元に近いところから超高速にレスポンス返しちゃおうぜ!」 みたいな機能をサーバレスで簡単に実装できるサービスです。 主なメリットは、  ・サーバレス ・費用対効果が高い ・設定が簡単 ・全世界に展開されたエッジ ・AWSの各サービスと連携できる あたりでしょうか。 DDoS対策としては、AWS WAF や Shield で保護できますし、使わない理由が見当たらない! 当社が管理しているサイトでは、静的なコンテンツ(画像・動画・CSS・JSなど)をCDN配信しており、動的なコンテンツについてもCDN配信に向けて検証中です。 皆さんも是非お試しください! それではまた! 
  • テクログ

    MacをWindows風に使ってやんよVol1

    こんにちわ。パグです。 最近コアテックもWindowsとMacが選択できるようになりました。 私は、プログラマー歴10年目ですが、実はMacを使ったことがなかったので・・・ 思い切ってMacを選択してみました。 というのも、Macって、テストの時にブラウザいじるくらいだったんですけど、 もうキーボード、マウスからしてぜんぜん違う。textに文字打てないやん。て。  今回移行したことによりWindowsってすごい簡単に使えるようになってるんだなぁとか これ、便利だったなぁと思うことが多くて!もうこの際、MacをWindows風に使ってやる〜!!!と 使い倒してやる〜と思った次第です。 これからWindows→Macへの以降を考えている方の参考になれば幸いです。  まず、MacってDIR構成がわからなかったんですよ。どこに何があるのよ!?って。 なので、Windowsと対比するように、自分なりに整理してみました。 WindowsってMyDocumentがあるじゃないですか。 C:¥Users¥の下にある程度その使ってる人の色々なものが入ってるやつ。 これが、あたりを見回してもない・・・ Windowsで一番素晴らしいんだなって思ったことって「エクスプローラー」です。 もちろんMacもDIRを階層的に使うことのできる「Finder」というものがあります。  Finderからなんでも見れるんですけどそもそも探し方がよくわかんない。 「どこに何が!!!」って思った人はまず、自分のDIRの階層を見てみましょう。  Finder>アプリケーション>ユーティリティ>ターミナル.app で黒い画面さんを開きます。 これがWindowsで言う所の、「コマンドプロンプト」的なやつ。画面が起動したら 「ls -l」と打ちます。するとC:¥Users¥配下と同じくユーザーの全てのDIRが出てきます。  これがこのStaffユーザーの全てよ!!!これに簡単にアクセスできるようにショートカットを作っちゃいます。  「pwd」と打つとじぶんが今どのDIRにいるのか確認できるので、Finderさんで見てみます。 移動>フォルダへ移動>から「pwd」で表示したUsersを打ってみます。一番上に表示されているstaffが私のMyDocument的な奴になります。ここで右クリックして「エイリアスを作成」でショートカットができました。ショートカットができたら、Desktopに設置してしまいましょう。これで、いつでも自分のDIRにアクセスすることができます。もし、右クリックしても何も出ないよ〜。となった時は・・・りんごさんマークからシステム環境設定からマウスの右クリックが有効になってない可能性があります。 はい。こんな感じで。ついでに、一つ前の画面に戻ってキーボードもWindows風にしちゃいます。CapsLockの位置がCommandボタンじゃないと慣れるまで打ちにくい・・・Windowsだと「Control+C」とかさ「Control+S」とかさ小指で打てるのに〜〜!!CapsLockを滅多に使わないのであれば、この部分をCommandButtonにしちゃいましょう。これでコピペもサクサク!!ってことで基本設定したとこで、次回はVagrantにApache、PHP入れて環境構築してみますー。ではでは。
  • テクログ

    vpc内でのRedis使用によって、冪等性を担保したくない?

    キャー!ちょう冪等性担保したいー! Lambdaの冪等性をvpc外で担保する場合、 Dynamoでやっていることが多いですよね。なぜLambdaの冪等性を担保しないといけないかというと、最低1回は実行されるけど、複数回実行されることもあるからです。vpc内でなにかをしたい。外との通信は別にいいかー、じゃあvpc内で担保したいな。ってなるよね。なるなるー。よくあるー。 となると、DynamoはつかえないのでRedisですね。はい、こうなりますよ。いかにもサンプル、なので利用はご自身の責任で。redisはpipでいれてね。import boto3 import redis import logging logger = logging.getLogger() logger.setLevel(logging.INFO) def lambda_handler(event, context):     print('start!')     #1分に1回走るとして、その重複を検知するキー     testkey = 'testdesu_2017-10-26_18-00'     redis_host = "lambda-redis-test.hostwo.irete.ne"     ttl = 900#10分強あれば十分すぎる     try:         redis_client = redis.StrictRedis(host=redis_host, port=6379, db=0)         #キーの存在を確認。あるならダブルでやられてるのでダーメ         key_exists = redis_client.exists(testkey)         #print(key_exists)         if key_exists == False:             logger.info('key:' + testkey + ' is not exists.')             redis_client.set(testkey, 'executed')             redis_client.expire(testkey, ttl)             #ここに独自にやりたい処理を入れるよ         else:             #キーがあっても別にエラーではないのでwarn程度             logger.warn('key:' + testkey + ' is already exists.so do nothing.')         logger.info('success')     except Exception as e:         #その他の例外時         logger.error(e)         logger.error('Exception')     print('end!') こんな感じです。 いやーRedisっていいなあ。