サクサク読めて、
アプリ限定の機能も多数！
アプリで開く
どうも、まさとらん（@0310lan）です！ 今回は、手描きしたスケッチをAIが美しいワイヤーフレームに自動変換して、動くプロトタイプを誰でも簡単に作成できるWebサービスをご紹介します！ 現時点ではクローズドベータによる参加となりますが、すでに実用的なレベルに調整されています。これからプロトタイプを作成しようと考えている人は、ぜひ参考にしてみてください。 【uizard 】 ■「uizard」ってどんなサービス？ 最初に「uizard」でどんなことができるのか簡単にご紹介しておきます。 このサービスのポイントは、手描きのスケッチをAIが美しいフレームワークに自動変換してくれることです。 変換方法は簡単で、手描きのスケッチをスマホのカメラで撮影するだけです！ するとAIがスケッチを分析してワイヤーフレームに変換してくれます。 さらに、PCのブラウザからプロジェクト画面を開いて自由に編集で
この記事では、ますます進化するウェブ制作の現場で重宝する、便利な最新オンラインツールをまとめてご紹介します。 「こんなツールが欲しかった」をかたちにした、制作ワークフローを改善できる時短ツールが多数揃っています。カテゴリごとに整理しているので、目的にあったお気に入りツールを探してみましょう。 前回のオンラインツールまとめと一緒に確認しておくと良いでしょう。Web制作の常識が変わる、便利な最新オンラインツール48個まとめ コンテンツ目次 1.Web制作便利ツール 2. デザインコレクション 3.イラスト系ライブラリ 4. 配色ツール 5. プロトタイプツール 6. アイコンツール 7. コラボ、リモートワークツール 8. 面白、クリエイティブツールWeb制作が面白いほどはかどる！便利な最新オンラインツールまとめWeb制作便利ツール Squircley デザイン制作で使える美しいSV
この記事では、Webデザインやグラフィックデザインの制作スピード、生産性がアップする、便利な最新オンラインツールをまとめてご紹介しています。 カテゴリ分けされたこれらのツールやサービスを利用すれば、面倒な作業をラクにこなし、作業の効率化をアップできるでしょう。「なぜ今まで使っていなかったのか」、そんな気持ちにさせる便利ツールが揃いました。 各ツールはカテゴリごとに整理しています、以下のリストを参考にどうぞ。 コンテンツ目次 1.Web制作便利ツール 2.イラスト系ライブラリ 3. 配色ツール 4. デザインコレクション 5. プロトタイプツール 6. コラボレーションツール 7. 面白、クリエイティブツールWeb制作フローが変わる！便利な最新オンラインツールまとめWeb制作便利ツール BrowserFrame 各種ブラウザ付きでスクリーンショットを撮影できるオンラインツール。目的の
「さあ、デザインするぞ！」 そう思ってmacに向かい、デザイナーなりたてホヤホヤの1年前の私はいきなり画面のビジュアルからつくり始めました。情報設計せず、最初からワイヤー書いて、色をつけていく…。今思い返すと失神しそうです😇 デザイナーになりたての方、もしくはデザイナーになろうとしている方のなかには「デザイナーはイケてるデザインを作るのが仕事」と思っている方も一定数いるのではないでしょうか。(決して間違ってはないけどね！) でも私は今こう思っています 「良いインターフェースは見た目から始まるわけではない」と。 今回は「はじめてのUIデザイン」を参考に自分が歩んだプロセスをしっかりと文字にして残しておきたい&私の経験が誰かの役に立てたら、と思いこの記事を書いています。 さ！前置きはこれくらいにして始めよう💨 [目次] 1.「はじめてのUIデザイン」について 2.私がデザインを担当したプロ
Dramaとは Dramaは、インタラクティブなプロトタイプやアニメーションが作成可能なUIデザインツールです。 公式サイトでは、Dramaによってできることとして下記の3つが挙げられています。 インタラクティブなプロトタイプやアニメーションが作れるUIデザインツールといえば、Framer XやInVision Studioなどが思いつきますが、使いやすさや操作性、機能の豊富さを比べるとDramaは頭1つ抜け出しているような印象です。 また、SketchやAdobe XDなどと比べるとUIデザインツールとしての機能に大きな遜色は無く、むしろ動作の滑らかさではSketchよりも勝っているのではないでしょうか。 Dramaを一言で述べると、「これまでのデザインツールのいいとこ取りをしたツール」であると言えるかもしれません。 現在はまだ正式リリースはされていませんが、公式サイトからベータ版をダウ
※ユーザー調査法は下記のように、大きく2つに分類される。両者の違いは、次回説明する。 ニーズ探索型:ユーザー調査、行動調査、フォーカスグループインタビュー 仮説評価型：ユーザーテスト、ABテスト、アンケート プロトタイプ 今回は、この中からプロトタイプを取り上げる。プロトタイプとは、一般的には「評価、改良を目的にプロダクトの模型を作ること」である。この連載での改良の対象は当然、プロダクトのUI（ユーザーインタフェース）やUX（ユーザーエクスペリエンス）が中心ではあるが、技術仮説の模型もプロトタイプと呼ばれる。 画面やインタラクションを丸ごとプロトタイピングしないUI開発にプロトタイピングが有効であることはよく知られているためか、下記のようなゆるっとした進め方により、結果プロトタイプ開発に工数をかけ過ぎてしまうことがある。 目的を定めずに、漫然と「決めた仕様に基づく使い勝手を確かめるため」
良いプロダクトを組織として作っていくにはどうすればいいのか。 今回はユーザ価値を積み上げるためにはどんなプロセスを踏めばいいのか というテーマで社内発表したことを書きたいと思います。 開発現場で頻発していた悲劇僕はUI/UXデザインを始める前は開発サイドのPMだったのですが、プロダクト作りにおける悲劇はデザインだけでなく開発の現場でもよく起きています。 こういう話が本当にたくさんの現場で起きていました。SEがブラックだみたいなイメージがついたのはそのせいじゃないかなと。 こういった悲劇を打開するためにどうするかという話で、最初は「ちゃんと考えて作る意識を非エンジニアも持とう」みたいなことで設計にかける時間を増やそうとするんですけど、人間は神様じゃないので最初からすべてを想定した完璧な設計って不可能なんですね。 そういった中で、↓のような発想とプラクティスが生まれました。 実物を見る工程が１
はじめに アプリによってビジネスモデルは異なりますが、大多数のアプリがゴール（KGI）にしているのは売上増かと思います。 では、あなたは売上増に向けた指標の把握と整理ができているでしょうか？ この記事ではKPIツリーを使ってアプリの売上に貢献する指標を洗い出し、各指標について説明したいと思います。 1.KPIツリーの重要性 ◆そもそもKPIツリーとは？ KPIツリーとは、例えばアプリのKGIを売上とした場合、売上を構成する要素を分解して施策が実行可能になるレベルまで落とし込まれた指標（KPI）の一覧です。 ◆KPIツリーを作らない場合の問題点 ①ボトルネックとなっている問題がわからない 売上を構成する要素を洗い出さないと、売上増の妨げになっている問題に気づかないことがあります。 ②具体的な施策を考えるのが難しい 売上やアクティブユーザー数など上位の指標を分解しないままでは、「じゃあその指標
[fancy_box]海外デザインブログDesignModoで公開された「The What, Why, and How of Mockups – Designmodo」より許可をもらい日本語抄訳しています。[/fancy_box] 今回はモックアップの作成方法を見ていく前に、モックアップとは一体何なのか、何ができるのか詳しく見ていきましょう。 TheGuide to Wireframing（詳しい紹介はこちらのエントリーで触れています。）でも取り上げていますが、モックアップとワイヤーフレームフレーム、そしてプロトタイプはしばしば混乱しやすく、それぞれの正確な情報を見つけにくくなります。しかしどれもUXデザインプロセスにおいて必要不可欠で、より最新の注意を払う必要があります。 まずはじめに、モックアップ作業がどのようにデザインプロセスにフィットするのか見ていきましょう。 各用語の意味を知ろ
1リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
