プロトタイピング

こんにちは。テックドクターでプロダクトマネージャーをしている田向です。テックドクターでは各種AIツールを積極的に導入し、プロダクト開発のプロセス改善に取り組んでいます。中でもUIデザイン生成ツールv0の導入は、単に個々のプロトタイプの実装を効率化するだけでなく、プロトタイプ開発全体を大きく加速させてくれました。本記事では、v0の概要から具体的な導入効果までをご紹介します。 v0とは v0は、Vercelが開発したAIツールです。自然言語のプロンプトや画像、Figmaファイルなどをもとに、WebやモバイルアプリのUIを簡単に作成できます。v0.app v0を選んだ理由 他にもUIを生成できるAI…

1. はじめに NTT西日本の相浦です。 NTT西日本公式の技術ブログが始まりました。記念すべき第一回ということで、最近の私の「やってみた」を共有したいと思います。 最近よく耳にするAIエージェント。でも、「結局どういう場面で役立つの？」と思う方も多いのではないでしょうか。 本記事では、自治体業務の一つである粗大ごみ収集申込の受付を例にして、対話型で申込受付をしてくれるAIエージェントのサンプルを作ってみたのでご紹介します。 作ってみて気づいた工夫ポイントや「ここは意外と難しい」というところも交えつつ、「自分の業務に当てはめられるかも」と思っていただける内容を目指します。 1. はじめに 2.…

はじめに 私がWebデザインとフロントエンド開発の世界で長年働いてきた中で、これほど画期的な機能の登場に興奮したことはありません。2024年6月、VercelのAI駆動UIデザインツール「v0」に「デザインモード」という革新的な機能が追加されました。この新機能は、AIに指示を出してUIを調整するという従来の方法から一歩進んで、直接的にUI要素を操作できる画期的な仕組みを提供しています。 従来のv0では、「ボタンの色を青に変更して」といったテキストプロンプトでAIに指示を出し、クレジットを消費してUIを再生成する必要がありました。しかし、デザインモードの導入により、この煩雑なプロセスが一変してい…

プログラミングの知識がなくても本格的なスマホアプリが作れる時代が、ついに到来しました。今回は、話題のAIエージェント「Rork（ローク）」について、私が実際に試してみた体験と共にご紹介します。プロンプト（テキスト指示）を入力するだけでiOSとAndroid両対応のアプリが作れるこのツールは、アプリ開発の常識を根本から覆す可能性を秘めています。技術的な知識がなくても、アイデアを形にできる新時代の開発ツールの実力とは？ Rorkとは？AIが駆動するノーコードアプリ開発の革命児 Rorkの主要機能と特徴を徹底解説 プロンプトからのコード自動生成 クロスプラットフォーム対応とExpo連携 コード編集と…

開発手法にはアジャイル型開発やプロトタイピング型開発、スパイラル型開発など様々なものがあります。アジャイル型開発のagileは、英語で機敏や俊敏の意味があります。アジャイル型開発はスピード重視の性質を持ち、上流工程から下流工程までを小さな機能順に進む手法です。そのため、最終結果が完了しなければわからないウォーターフォール型とは異なり、それぞれの機能順に結果を確認できる点がメリットと言えます。また、およそ1ヵ月もあれば企画からテスト検証まで可能で、次の機能に進むことができるためスピード重視のクライアント向けでもあるでしょう。 そして、プロトタイピング型開発とは、試作品（プロトタイプ）を開発の早期…

Next.js, GraphQL, Hasuraのキャッチアップも兼ねてプロトタイピングに関する書籍（実践プロトタイピング 〜Webフロントエンド＆バックエンドでプロトタイピング〜 - 東京ラビットハウス - BOOTH）を読み進めていくにあたり、忘備録を残しておこうと思います。 ただ書き写すのではなくて、自分の言葉や解釈で書いていこうと思うので一部間違っている部分などがあるかもしれないので、気になる方はコメントもしくは僕のTwitterとかでDMいただければと思います。 twitter.com では、始めていきましょう！（謎テンション） プロトタイピングとは そもそもプロトタイピングとはどん…

こんにちは。弁護士ドットコム デザイン部の林（@taka_piya ）です。普段は弁護士向けの業務システムのデザインをしています。 10月から3月まで週1回、デザイン部内でJavaScript勉強会を開催しました。この記事ではその具体的な内容と成果、振り返り、頂いたフィードバックをご紹介します。ぜひ社内勉強会のネタに！ JavaScript勉強会をはじめたきっかけ （1）作るプロトタイプの幅が広がる （2）漏れのないUI設計ができるようになる 勉強会の内容 基礎編 基本を一歩ずつ学ぶ 身近なお題を取り入れた演習をやる 周辺知識にも触れる 応用編 （１）Vue.jsの基本を学ぶ （2）作りたいミ…