【UXデザイナーって何してる？】MFXのUXデザイナーの1日を紹介します！｜ちゅうさん＠Designer
ちゅうさんです。 私が所属するMoney Forward X本部にはUXデザイナーが4名在籍しており、日々新しい金融体験を考えています。 ですがUXデザイナーはどんなことをしているのかわかりにくい仕事。 そこで在籍するメンバーの1日を紹介して、X本部のUXデザイナーがどんなことをしているのか書きたいと思います！ これからUXデザイナーを目指す方や、クライアントワークをしているUXデザイナーがどのようなことをしているのか気になる方に、少しでも参考になれば嬉しいです😉 1.グループリーダー、さっさーの1日 【プロフィール】 研究者肌なMFSDグループのリーダー。前職はビールサーバーなどのハードウェアのデザイナーで、大のビール好き。【今どんなことしてる？】 ユーザー調査に分析、クライアントとのワークショップなどを中心に、様々なプロジェクトで体験設計のアドバイスや、プロセスの体系化、チームビルデ
Adobe XD 2020年10月の新機能！ついにVisual Studio Codeと連携可能に
昨日から開催されているAdobe MAX（10/23まで）と同時に、Adobe XDの最新アップデートがリリースされました！ 今までになかったまったく新しい新機能をはじめ、さまざまな機能の強化、共同編集機能の正式版、中でもCCライブラリ強化とVS Code連携は、ワークフローがさらに改善されると思います。 Adobe XDの新機能 まずは、Visual Studio Code連携。 VS Codeのプラグインとして無料で利用でき、デベロッパーはデザイントークンを数秒で作成し、Web、iOS、Android、Flutterなど複数のプラットフォームに向けてアプリをコンパイルすることができます。コーディング中は、関連するドキュメントやコードスニペットに素早くアクセスすることができます。 プラグインのインストールは、下記ページから。 ※2020年10月20日リリースのAdobe XD34でご利用
C#でSPAが実現できる、Blazor WebAssemblyのはじめかた
ASP.NET Coreは、ASP.NET 4.xをベースにしていますが、Webフォームには対応していません。また、開発言語にVisual Basicが利用できなくなりました。 一方、ASP.NET Coreになって、新たなライブラリ、フレームワークが提供されています。Razor Pagesは、ASP.NET Core 2.0から利用できる機能で、MVVMパターンのWebアプリケーションを実現できるフレームワークです。 MVVMパターン Razor Pagesでは、Viewにあたる部分はRazor構文によるcshtmlファイル（HTMLを拡張して、C#コードなどを含めることができる）に、ViewModelはそのcshtmlから生成されるC#のクラスになっています。このあたりの構造は、その後にリリースされた、Blazorフレームワークでも同様となっています。 Blazorは、通常JavaSc
Amazon ElastiCache for Redis が、マネージド型のロールベースのアクセスコントロール (RBAC) を備えた Redis6 のサポートを追加
Amazon ElastiCache for Redis が Redis6 をサポートするようになりました。このリリースでは、Amazon ElastiCache for Redis にいくつかの新しい重要な機能が追加されています。 • マネージド型のロールベースのアクセスコントロール – Amazon ElastiCache for Redis 6 は、Redis コマンド向けのロールベースのアクセスコントロール (RBAC) をセットアップするために使用できるユーザーとユーザーグループを作成および管理する機能を提供するようになりました。複数のアプリケーションが互いのデータにアクセスできずに同じ Redis クラスターを使用することで、セキュリティの境界を維持しながらアーキテクチャを簡素化できるようになりました。また、きめ細かいアクセス制御と承認を利用して、管理ユーザーグループと読み取り
AWS ElastiCache Redis のクラスターモード無効の挙動確認と Terraform 設定 - Qiita
1. 概要 AWS ElastiCache Redis の クラスターモード無効 で次の挙動を把握したい エンドポイント レプリカノードのスケールアウト/イン マルチAZ ノードのスペックアップ/ダウン フェイルオーバー Terraform の設定の理解や、実行手順を確認したい 2. 検証するElastiCacheの構成 ElastiCache のサブネットグループは次の３つのAZを選択 ap-northeast-1a ap-northeast-1c ap-northeast-1d Redis の クラスターモードは「無効 (disabled)」を選択 小中規模のサービスで利用することを想定しているため 3. クラスターモードが無効の場合の機能や注意点 レプリカノードのスケールアウト(追加)、スケールイン(削除) が可能 ノードタイプのスケールアップ、スケールダウンが可能 データのパーティ
Elsa - 小さくてセキュアなJavaScript/TypeScript実行環境 MOONGIFT
nodeやWebブラウザ上のJavaScript実行エンジンとしてはv8が最もよく知られています。かつてに比べると圧倒的に拘束で、JavaScriptがWebアプリケーションなどで十分に使えるようになったのはv8エンジンのお陰でしょう。 そんな中、新しいJavaScript/TypeScript実行エンジンとしてElsaを紹介します。言語はGoを採用しています。 Elsaの使い方 実際に使っているところとしては、普通に使えますといった感じです。 $ go run main.go run js/00_core.js { "FSCwd": 5, "FSDirExists": 4, "FSExists": 3, "FSMkdir": 9, "FSRead": 2, "FSRemove": 7, "FSStats": 6, "FSWrite": 1, "Fetch": 20, "Log": 10,
エンジニアでもビジュアルでコラボレーションせよ GoodpatchのUXエンジニアが教えるチームの認識を揃える方法
Goodpatch主催のイベント「のぞき見企画！ICS×Goodpatch Anywhere合同勉強会」で、Goodpatchの黄兪維氏は、ふだん開発やUXデザインなどの分野の業務に関わっている観点から、「フロントエンド視点からのビジュアルコラボレーション」について話しました。関連記事はこちら。 クラウド型ワークスペースの開発に関わるUXエンジニア 黄兪維氏（以下、黄）：今回は「フロントエンド視点からのビジュアルコラボレーション」について共有します。 発表のアジェンダについて。まずは自己紹介。次にGoodpatchによくあるWHYからの理論を説明しつつ、最後に結果とまとめをお伝えします。 それでは自己紹介から。僕の名前は黄兪維と言います。GoodpatchのProduct DivのUXエンジニアです。台湾出身で、前職は台湾のWeb制作会社でインタラクションデザイナーとして働いていました。現
効果を維持しつつテスト工数を削減した話 〜テスト設計改善の質問回答編〜
以降では、このテスト設計改善の取り組みに対する質問に回答していきます。 テスト設計改善についての質問の回答 【質問1】テスト設計にあたって開発ドキュメントの参照はしないのでしょうか。開発ドキュメントがほとんど無い？ 開発ドキュメントの参照はします。チケットの内容、開発ドキュメントだけでなく、その内容に対しての疑問点は実際に開発と議論しておきます。開発者との議論はテスト設計に着手する前、テスト観点出しを行う前後の活動です。 【質問2】テストと設計の比率を出していらっしゃいましたが（テストをいっぱいやるようにした）、数える単位は何ですか？人数？時間？その他？ 説明資料では文字の大きさの都合上省略した形で書いていますが、比率を出していたのは「（開発の設計ではなく）テスト設計」と「テスト実施」の比率です。また、ここでの比率は感覚値ではありますが、工数比です。 【質問3】改善後の成果物サンプルやアク
スクラムにおける技術的スパイクの進め方
みなさんこんにちは。@ryuzeeです。 スクラムでは、スプリントに投入するプロダクトバックログアイテムはReady（準備ができている）である必要があります （Readyとはどんな状態なのかについては以前に詳しく説明したので、そちらを参照してください）。 Readyにしておくことによって、成果の量が安定しプロダクトオーナーやステークホルダーにとっては予測精度が向上していきます。 Readyにする活動は単に受け入れ基準を用意したり、プロダクトバックログの内容を精緻化したり、並べ替えたりするだけではありません。 スプリント内でプロダクトバックログアイテムが完成する可能性を上げるために必要な活動すべてが含まれます。 そしてその中の1つが技術的な調査です。 スプリントでプロダクトバックログアイテムに着手してから実現方法を調べたり、技術的な制約によって大幅な方針転換したりするのでは遅い上に予測性が低
先が読めないからこそアジャイルが役に立つ 予定調和にハマらないためのスクラム活用術
スクラムの初心者からエキスパート、ユーザー企業から開発企業、立場の異なるさまざまな人々が集まる学びの場でもあるスクラムフェス大阪2020。「今あえてのスクラム」のテーマで登壇するのは、株式会社アトラクタのFounder兼CBOでもある永瀬美穂氏。後半となる今回は、いよいよスクラムの話に突入します。スクラムについての振り返り方や、今までの価値観に囚われていてはダメで、新しい価値観の構築が必要など、これからのスクラムとの接し方について話してもらいました。 スクラムとは 永瀬美穂氏（以下、永瀬）：まずは、そもそも「スクラムって何ですか？」という話になります。本当に頼んだわけでもないのに、最初のオープニングトークというかネタがうまくハマっていまして。「マネジメントのためのフレームワークなんですか？」とかを考えている人ももちろんいるでしょう。例えば「スプリントを回すことによって改善し続ける方法、開発
セキュリティ的に意味なし “旧ノーマル”な職場にはびこる習慣、その名も「PPAP」を知っていますか
この際捨てるべし！ ～2つ目～ みんな知ってる「PPAP」を何とかしよう 次は「PPAP」です。ここでいうPPAPとは、ピコ太郎さんがミームとして全世界に広げた“ペンパイナッポーアッポーペン”ではありません。PPAPとは、日本情報経済社会推進協会（JIPDEC）の大泰司章氏が取り上げたプロトコルで、皆さんが職場で身近に感じていて、「アレ、本当に効果あるの？」と思っているITしぐさです。 というもの。さて皆さん、心当たりはありましたか。普段職場でメールをやりとりしていると、「PPAP」方式で添付ファイルが送られてくるケースがいまだにあると思います。 一見、このやり方は非常に手軽に実現できる“セキュリティしぐさ”のようでしょう。しかし、実はセキュリティ面でリスクをはらむだけでなく、非効率な部分もあるのです。 例えば、添付ファイルにパスワードがかかっていると、職場で運用されているマルウェアフィル
Using MSBuild.exe to "Publish" a ASP.NET MVC 4 project with the cmd line
I'm looking for a command to run against the MSBuild.exe that just takes a MVC 4 project and publishes it to a given directory. For example, MSBuild <solution>/<project>.csproj -publish -output=c:/folder This is obviously incorrect syntax. I'm trying to simplify my question. This question talks of a build XML, but I'm not trying to do anything with that much detail. I'm simply trying to do a deplo
上野学「オブジェクト指向デザインの道具論」 | ÉKRITS / エクリ
——— 上野さんが出版された本『オブジェクト指向UIデザイン※1』は、体裁が実用書という形で、副題には「使いやすいソフトウェアの原理」とあって、そしてユーザーインターフェース（UI）の「操作性と開発効率の劇的な向上」と書かれています。なので、基本的にはUIデザイナーの人たちに向けた実用マニュアルみたいなもので、そこをメインターゲットとして想定しているんでしょうか。 上野： これは技術評論社という出版社の一連のシリーズなんです。もともとコンピューター関係の技術本を出してるので、想定読者としてはコンピューター技術者ですね。たぶんこのシリーズで初めてのデザインに関する本なんですが、技術者向けの枠組みでデザインについて書いています。担当編集者の方には、前から雑誌記事でお世話になっていて、僕がどういうことを書くのかよくわかっていたので、かなり好きなことを書かせてもらいました。 § ——— ただこの「
「GraphQL」徹底入門 ─ RESTとの比較、API・フロント双方の実装から学ぶ｜ハイクラス転職・求人情報サイト AMBI（アンビ）
scalar型を新しく定義するためにはscalarキーワードを使います。例えば、Date型を新しく定義するには次のようにします。 scalar Date スキーマではこれだけですが、実際に使う際はGraphQL処理系に対してさらにシリアライズとデシリアライズを定義することになります。 GraphQL組み込みのscalar型は先にあげたものだけなので、例えばバイナリ、日付と時刻、HTML/XML、BigIntなどを必要に応じて追加することになるでしょう。ただしその場合、サーバーサイドとクライアントサイドでシリアライズ・デシリアライズの実装を一致させる必要があります。 Enum enum（イナム）はscalar型の一種で、特定の値のみを持つ型です。例えば、組み込みscalar型であるBooleanをenumで宣言すると次のようになるでしょう。 enum Boolean { true false
JavaScriptデザインパターンは登録されてます。 | 積読ハウマッチ
JavaScriptデザインパターンを登録してる人をみる。6人が登録してます。
Vue.jsコミッターkazuponに聞く、良質なDX（開発体験）がもたらす良質な開発サイクル｜ハイクラス転職・求人情報サイト AMBI（アンビ）
Vue.jsコミッターkazuponに聞く、良質なDX（開発体験）がもたらす良質な開発サイクル 近年大きな注目を集めるフレームワークとなったVue.js。その発展の裏には、開発コミュニティをストレスなく駆動させる、コミッターたちのさまざまな工夫がありました。黎明期からVue.jsを支える、コミッターの川口和也（kazupon）さんに、フレームワークを躍進させるために必要なことを聞きました。 WebアプリケーションのUI実装を簡単に行える、オープンソースのJavaScriptフレームワーク・Vue.js。利便性の高さと導入の容易さから、近年サービスに採用されるケースが増えています。 そして、Vue.jsの黎明期から、コミッターとしてフレームワークの成長を支えてきたエンジニアがいます。Vue.js日本ユーザーグループの運営に携わるkazuponこと川口和也（かわぐち・かずや／ @kazu_po
「レストランボード」における大規模フロントエンドの漸進的なVueリプレイスの取り組み
はじめに こんにちは、レストランボード（以下、RB）のフロントエンドチームの石亀です。担当していた規模の大きめなプロジェクトでVueを結構触っていまして、設計含め困難と向き合いながら色々取り組ませてもらったのでそれをナレッジとして残そうと思い記事を書くことになりました。エモいですね。 RBは現在自社のフレームワークで構築されていて、徐々にVueでリプレイスをかけています。 今回、大規模なプロジェクトにてVueでさらなるリプレイスを実行しましたが、プロダクト自体がとても大きく且つ限られたリソースの中でいかに負債化させずにできるだけ安全に移行させるかを検討しました。 そこで実際に実施した施策や検討内容などを紹介します。 おそらく、多くのサービスやプロダクトで既存のコードを新しいライブラリ・フレームワークで書き換えているかと思います。 背景だったり関わる規模・コンテキストが異なるとは思いますが、
Vue.js developers' guide to React
If you already learned one language or framework, it's easier to learn similar ones. Instead of reading docs from top to bottom, you just think, "how to do X with Y?". In this article, I introduce React way of implementing Vue.js features for Vue.js devs who want to learn React as well. (I don't encourage anyone to switch from Vue.js to React! It's better -- and also fun -- to getting to know both
Developing a Single Page App with Flask and Vue.js
The following is a step-by-step walkthrough of how to set up a basic CRUD app with Vue and Flask. We'll start by scaffolding a new Vue application and then move on to performing the basic CRUD operations through a back-end RESTful API powered by Python and Flask. Final app: Main dependencies: Vue v3.2.47 Node v20.0.0 npm v9.6.4 Flask v2.2.3 Python v3.11.3 Contents Objectives By the end of this tut
猫が飼い主の顔色を読んで振る舞っている証拠
猫の鳴き声は人好みにかわいく進化した!? 仕事に集中していると、すたすたと歩いてきて、「にゃお～ん」とかわいく鳴く猫。ついついかまってあげては仕事が進まず……なんていう経験をしている飼い主は、私だけじゃないはず……。 猫の「ミャオ」という鳴き声は、意外にも大人になった猫同士ではほとんど使われません。本来、仔猫が母親の気を引くための鳴き声だからです。 つまり、大人の猫が「ミャオ」と鳴くのは、対人に限定されているのです。 猫は対人用コミュニケーションで自らの強力な武器である「かわいい」鳴き声を使って、人を見事に操っているのですね。 それではその鳴き声は、昔からかわいかったのでしょうか？ 祖先種と比較して、本当にかわいくなっているのかを調べた論文があります。 アメリカのコーネル大学の研究者は、ヤマネコの「ミャオ」という鳴き声と猫の「ミャオ」という鳴き声の音響解析を行いました。 すると、猫の「ミャ
Let's stop fooling ourselves. What we call CI/CD is actually only CI.
Let's stop fooling ourselves. What we call CI/CD is actually only CI. Cover Photo by Yan from Pexels Yes - this post started as a tweet. One that went semi-viral. It struck a real, naked, buzzing nerve. A nerve that most of us prefer not to touch. Some of us pretend it's not a real pain, others are just too busy fixing production issues. Still others - and that would probably be the majority of th
「Internet Explorer」が終わる日 代役はEdgeでもChromeでもない“あのブラウザ”か
関連キーワード Internet Explorer（IE） | Microsoft（マイクロソフト） | ブラウザ Microsoftのサブスクリプション形式のオフィススイート「Microsoft 365」が、2021年にWebブラウザ「Internet Explorer 11」（以下、IE 11）で正常に動作しなくなることが明らかになった。かつて支配的なWebブラウザだったIEは、一段と影が薄くなる。 併せて読みたいお薦め記事 Webブラウザの市場シェア争い 「Edge」と「Chrome」の“新・ブラウザ戦争”に勝者がいない理由 Chromiumベースの新「Edge」がChromeに勝てる“たった一つの条件” Microsoft Edge vs. Google Chrome 最新機能でシェアは変わるか Microsoftは「Edge」で挽回できるか IEモード以外の「Edge」新機能「プ
App Clipの完全ガイド：App Clipの作成、Safariのバナーに追加したら、QRコードを生成し、情報を保存して位置情報と呼び出しURLを確認し、そして主要アプリを推奨します。 - Qiita
App Clipの完全ガイド：App Clipの作成、Safariのバナーに追加したら、QRコードを生成し、情報を保存して位置情報と呼び出しURLを確認し、そして主要アプリを推奨します。SwiftUIiOS14AppClip この記事の冒頭では、App Clip 作成のプロセスについて説明します。 また、AppClipに関する高度な話題についても一部説明します。 ユーザーがアプリケーション全体をインストールすることにした場合、アクセスのためApp Clipの情報を保存して下さい ユーザーの位置を確認する 通知の予定を入れる ユーザーにメインアプリケーションを勧める App Clipを起動させたURLを読み取る App Clipがどんなものか見てみましょう この記事を書く前に、私が発表したプログラミング記事のリストを提示するApp Clipを作成しました。iPhoneでこのQRコードをスキャ
Tracing TypeScript Compiler
はじめにTypeScript 4.1 で新しく増えた --generateTrace という TypeScript Compiler の profile を取得するオプションについて。 TypeScript 4.1 beta でもすっ飛ばされていたネタなので、多分あまり注目されていないだろうし、 僕もたまたま PRs を眺めていたら見つけた程度だし、他の feature と比べるとかなりニッチなのだけど、個人的に面白かったのでエントリに残しておく。 なぜ僕が今回のオプションに惹かれたかとういうと、 3 ヶ月くらい前に、仕事でやっている TypeScript のプロジェクトについて「ローカルでの tsc が遅い！なんでだ！」って感じで憤ってた時期があって、 どこにボトルネックがあるか調べようと思ったことがあったのだけど、このときは深く調べることができずに挫折したという経緯があるため。 ちなみ
React Native for Web + TypeScriptを使ってReact公式のチュートリアルをやってみた | DevelopersIO
React公式ページのチュートリアルをReact Native for WebとTypeScriptを使ってやってみました。 実装するもの React公式ページのチュートリアルの三目並べゲーム 今回作成したソースコードの一式はこちらにあります。 実装方針 Create React Appを使ってプロジェクトを作成する TypeScriptを使用する 画面の作成に、React Native for Webのコンポーネントを使用する チュートリアルの内容（*2020/3/2時点）に沿う 事前準備 Create React Appを使ってReactアプリを作成し、TypeScriptとReact Native for Webを導入します。今回は以下の記事でご紹介した方法でReactアプリを作成し、TypeScript、React Native for Web、Prettierを導入しました。 C
ワイ「TypeScriptのエラーが読まれへん」 - Qiita
前回の記事の続きです。 TypeScriptが気に入ったワイ ワイ「TypeScript、素敵やん」 ワイ「だって、ミスったコードを書くと・・・」 ワイ「↑こんな感じで、コンパイラが教えてくれるから」 ワイ「だいぶバグ発生率を抑えられそうや〜ん」 しかし ワイ「おっ」 ワイ「またエラーメッセージが出たで」 ワイ「ファッ！？」 ワイ「今度は英語やないか」 ワイ「しかもちょっと長い！」 ワイ「意味わからんで」 ワイ「Google翻訳してみよか」 タイプの引数 '{名前：文字列; 年齢：文字列; } 'はタイプ' User 'のパラメータに割り当てることはできません。 プロパティ「age」のタイプには互換性がありません。 タイプ 'string'はタイプ 'number'に割り当てることができません。 ワイ「いや翻訳しても分からん！」 助けを呼ぶ ワイ「ハスケル子ちゃ〜ん！」 ハスケル子「なんで
CSSの変数（カスタムプロパティ）の基礎知識、便利な使い方を詳しく解説
CSSの変数（カスタムプロパティ）の基礎知識、便利な使い方を詳しく解説します。Webページやスマホアプリのレイアウト、コンポーネントなど、実際の使用例がたくさんあるので、実用的なテクニックが満載です。 CSS Variables 101 by Ahmad Shadeed 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに CSSの変数（カスタムプロパティ）とは 変数名の付け方 CSSの変数のスコープ CSSの変数のフォールバック CSSの変数の効果的な使用例 インラインでCSSの変数を定義 メディアクエリでCSSの変数を定義 CSSの変数の継承 CSSの変数のバリデーションの仕組み CSSの変数の興味深い発見 デベロッパーツールで使用できる便利なテクニック 終わりに はじめに CSSの変数（別名: カスタムプロパティ）がブ
SEO Mythbusting S2エピソード7：GoogleとSEOコミュニティの関係 | アユダンテ株式会社
Google WebmastersのYouTubeチャネルで配信されたSEO都市伝説の誤解を解くシリーズ「SEO Mythbusting」のシーズン2、最終エピソードを翻訳してお届けします。 （エピソード6はこちら） シーズン2の最後のテーマはGoogleとSEO担当者のコミュニティとの関係、ゲストはSearch Engine Roundtableなどでも知られているRustyBrick CEOのBarry Schwartz氏です。 以下、シーズン2エピソード7の内容をまとめます。一部省略や言い換えをしておりますが、主な意味が失われないようにまとめております。 「状況による」は具体的に何によるのか Splitt氏： 多くの質問に対しての回答はやっぱり「状況による」（It depends）になります。 Schwartz氏： 具体的に何によりますか？ Splitt氏： 色々なことによります。何
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Wrapping JavaScript libraries in Blazor WebAssembly/WASM
日本のコンピュータ情報 : 富士通
新規開発の不確実性を軽減する「仮説検証型アジャイル開発」の支援サービスを提供 Relicとレッドジャーニー
TechCrunch
Making the most of your one-on-one with your manager or other leadership - Stack Overflow
The Three Key Ingredients Of Leadership You Need
Product recommendation design patterns for retail analytics | Google Cloud Blog
Naming Applications and Microservices
Quasar vs. Vutify vs. Bootstrap Vue: Choosing the Right Vue.js UI Library
VueConf Toronto 2023 - Vue.js Conference
Getting started with MDX and Vue.js/Nuxt.js - LogRocket Blog