miine

フロントエンドエンジニア。Vue.js, Nuxt.jsをよく使います〜!UI/IXも…

miine

フロントエンドエンジニア。Vue.js, Nuxt.jsをよく使います〜!UI/IXも興味あります。

最近の記事

Designship 2020

2020.10.24 Sat. - 10.25 Sun. @Online 視聴しました!全ては網羅できませんでしたが、印象に残ったことを中心にメモ。 脱境界ライゾマティクス・アーキテクチャー 主宰 齋藤精一 さん - これからは様々な分野が組み合わさっていく時代     - IoT, インフラ, 行政, 自動車, etc...     - いろいろなことを知っていないといけない - 境界を持たない(越境、ではなくそもそも境界がないという考え方) - 今まで通りの方法でや

    • Voiceflow を触ってみた

      Voiceflow とはVoiceflow は、ノンコーディングで Alexa / Google Assistant 用の音声アプリケーションを作ることができるサービスです。 使い方Alexa を持っていないので、 Google Assistant 用のアプリケーションを作ってみることにしました。 まずプロジェクトを作成します。 1. プロジェクト名を入力 2. Google Assistant を選択 3. 起動時の呼び名と言語を設定 「Invocation N

      • Origami Studio でインタラクティブプロトタイプ

        Origami Studio とはFacebook謹製の、より実装レベルに近いプロトタイプを実現できるプロトタイピングツールです。リッチなアニメーションやテキストの入力などが実現可能です。 基本操作Origami Studio では、インタラクションとそれに対する操作を設定して動きを作っていきます。 今回は、横スクロールするエリアを作ってみます。 まず、要素の「+」ボタンを押して「Interactions」からお好みのインタラクションを選びます。(今回は「Scroll

        • UX MILK All Night 視聴レポ

          9/12(Sat.) ~ 9/13(Sun.) に開催された UX MILK All Night を視聴しました! 視聴したセッションについて、いくつかまとめました。 少々長くなってしまいましたが、お付き合いください... !笑 Withコロナ時代の変化をとらえるUXデザイン 岡 昌樹さん(株式会社ポップインサイト) まとめ - 変化の意味・価値で観測しよう - プロセスを分解することで価値を生むために再構築しよう - 素早く小さく作って検証しよう 変化の意味・価値で観

        Designship 2020

          Google Teachable Machine で画像認識

          Teachable Machine とは Google が提供する、ブラウザ上で機械学習モデルが作成できるツールです。 機械学習やプログラミングに関する知識が不要で、誰でも簡単にモデルを作成できます。現在は、画像・音声・ポーズ の3種類のモデルを作成できます。 画像認識モデルを作る今回は「画像認識モデル」を作ってみました! 作り方はとっても簡単。大まかに次の3ステップで完成しちゃいます😳 さっそく作っていきましょう〜💪 まずは「使ってみる」をクリックします! 「画像プ

          Google Teachable Machine で画像認識

          配色を決める時に使っているツール

          デザイナーではありませんが、デザインにも興味があるフロントエンドエンジニア(?)です。 UI をデザインすることがあるので、配色を決めるときに使っているツールを紹介します。 1. Material palette generatorMaterial Design が提供するカラーパレットジェネレータです。 Material Design といえば、Google が提唱するデザインガイドラインで、Android アプリの UI でもおなじみですね。理論的かつ具体的なルール・

          配色を決める時に使っているツール

          SketchユーザーがXDの使い方を勉強してみた

          前職・プライベートではSketchを使っていたのですが、現職では XD を使っています。 がっつり使うことはないので XD はなんとな〜く使っていたのですが、作業効率を上げたいので基本的な使い方を勉強してみました。 ※ 基本機能といいつつ、Sketchでよく使っていた機能を、XDではどう使うのか調べてみました! 1. コンポーネントSketch の "Symbol" は、UIパーツをコンポーネント化(共通化)できる機能です。Symbol 側を修正すると、インスタンスにも

          SketchユーザーがXDの使い方を勉強してみた

          LINE を RSS リーダーにする

          自分に合う情報収集の仕方はないかな〜と思っていたときに、LINE Notify を見つけました。 LINE Notify を使って、LINE で新着ニュースの通知を受け取れるようにしてみました。 LINE Notify とは?Webサービスからの通知をLINEで受信できるサービスです。 GitHub や IFTTT,  Mackerel などと連携できます。 LINE Notify と IFTTT を連携する早速、 LINE で RSS フィードを受け取れるようにしていき

          LINE を RSS リーダーにする

          Webex Teams Bot で詰まったところ

          業務でWebex Teams Botを使っていて詰まったので、備忘録も兼ねて。 要件こういうBotを作ろうとしていました。 ・Botに対して Space ID を送ると、自分をそのスペースに追加してくれる ・Botへのダイレクトメッセージ(DM) または BotがいるスペースでBotにメンション どちらでもOK ・追加できるのは、Bot自身が参加しているスペースのみ ・追加に失敗したら、フィードバックとしてBotがメッセージを返す Webhookの設定今回は、 はじめ以

          Webex Teams Bot で詰まったところ

          リモートワークハッカソン@オンライン

          先日こちらに参加しました! 自分の振り返りを兼ねて、書きたいと思います。(遅ればせながらですが...) 「リモートワーク」がテーマだったのですが、素敵なアイデアがたくさんのハッカソンでした! 概要タイムテーブルはこんな感じです。 10:00 オープニング、チェックイン・自己紹介 10:20 アイディエーション&チームビルディング 11:30 今日の制作目標を各自宣言 18:30 各自成果発表 19:30 クロージング アイディエーション&チームビルディングのフェーズ

          リモートワークハッカソン@オンライン

          Sketch vs Figma、どちらを使うべき?

          Sketch / Figmaとは?Sketch、FigmaはどちらもアプリやWebのUIデザインによく使われるツールです。 私自身は画面のモックの作成やデザインなどに、約1年くらいSketchを使ってきましたが、デザインで有名なGoodpatch社がFigmaを推している理由が気になったので触ってみました。(Adobe XDは今回触れません。使用したことないので、また別の機会に...🙏) 簡単にSketch/Figmaの比較と、Sketchは2020年にSketch Te

          Sketch vs Figma、どちらを使うべき?

          Webex Teamsで何か言ったらリプライしてくれるBotを作ってみた

          業務でWebex TeamsのBotに触れる機会があったので、備忘録を兼ねて書いてみます。 Webex TeamsとはWebex Teamsは、Cisco製のコラボレーションツールです。チャットをはじめ、テレビ会議、画面共有、ホワイトボードなどの機能が1つになった、オールインワンのツールです。 1. Botを作成するBotの作成には、Webex Teamsのアカウントが必要です。まだ持っていない場合は、こちらからアカウントを作成します。メールアドレスを入力して「Try F

          Webex Teamsで何か言ったらリプライしてくれるBotを作ってみた