指示したUIをAIがTailwindベースで実装してくれるv0が凄い
v0とは v0は自然言語で作りたいUIをAIに指示するとそのUIをTailwind (shadcn/ui)ベースで作ってくれるサービスです。 shadcn/uiとは shadcn/uiはRadix UIというUIをもたないヘッドレスUIに対してスタイルを当てたコンポーネント集で、TailwindというCSSライブラリを使ってRadix UIに対してスタイルを当てています。 shadcn/ui本体のライブラリがあるわけではなく、自身のプロジェクトにコンポーネントを直接コピーして使うことが特徴です！ Tailwindが好きな人にはたまらないコンポーネント集ですね！ shadcn/uiに最適に作られていますが、Tailwindユーザーであれば作られたUIをほぼそのまま使うことができます。 下の画像のようなチャット風のUIが特徴なサービスになっていて、このチャットに指示を出すことでUIを作ってくれ
成功法則が詰まったBtoBサイトの標準ワイヤーフレームを無料配布します | knowledge / baigie
約1年前、BtoB企業における顧客獲得型サイトの勝ちパターンをまとめた『BtoBサイト・チェックリスト』を、ベイジ、才流さん、WACULさんの3社連名で発表し、大きな反響をいただきました。 このチェックリストはブログで公開しただけではなく、私たちのウェブ制作の現場でもフル活用されています。この1年間に手掛けた多くのBtoBサイトが、このチェックリストを満たすように設計され、多くのBtoBサイトでコンバージョン数/率やフォーム誘導数/率の向上など、ポジティブな変化が生まれました。 このような活動の中から、『BtoBサイト・チェックリスト』の内容を満たした『BtoBサイト・ワイヤーフレーム』なるものが誕生しました。これを今回、皆さんにご提供します。リード情報なども一切取らず、そのまま丸ごとお渡しします。 BtoBサイト標準ワイヤーフレームXD版（770KB） BtoBサイト標準ワイヤーフレーム
Free Frontend
Welcome to FreeFrontend! Discover our curated collection of over 10,000+ free code snippets in HTML, CSS, JavaScript, Bootstrap, Tailwind, jQuery, React, Vue, and other. This resources are designed to enhance your frontend development journey, regardless of your level of experience. Begin building and be inspired. Keep up via RSS These are the latest 10 posts. Digest (#16, 2024) offers solutions f
フロントエンドエンジニアから、デザイナーさんに意識してほしい10のこと｜Pittan｜note
フロントエンドエンジニアとデザイナーさんは日々協力してプロダクトを作っていく関係にあります。デザイナーさんが作ってくれたものをエンジニアが素早く実現できるよう、いくつかエンジニアから意識してほしいことをまとめました。 なんでこんな話になったのか（前置きなので次の章まで飛ばしてOKです） デザイナーさんから「この画面をこんな風に作ってください」とXDやSketch、PSDなどいろいろな形で渡されることがあると思います。 僕の個人的な意見・経験ですが、いざ実装するぞとなったときに 「あれ…ここってどうしたらいいんだろう？」 と迷って作業のスピードが落ちてしまうことがとてもストレスに感じていました。できればノンストップでいきたいなあと思うわけです。 手が止まるたび、デザイナーさんに「ここってどうしたらいいですか？」と質問するのが何か新しい画面を作るときに必ず発生していました。 「（いつも聞いてる
Figma: The Collaborative Interface Design Tool
Downloads Get the desktop, mobile, and font installer apps
スマートフォン、タブレット、デスクトップのためにレイアウトの幅をどのように設計すればよいか
iPhoneやAndroidなどのスマートフォン、「新しいiPad」などのタブレット、そしてデスクトップなど、さまざまなデバイスの幅に対応させるResponsive Web Designのために、どのようにレイアウトの幅を設計し、いくつレイアウトを用意するのか3つの方法を紹介します。 各デバイスの幅は、2012年3月のデータです。 A Simple Device Diagram for Responsive Design Planning [ad#ad-2] 下記は各ポイントを意訳したものです。 キャプチャに使用している画像は元記事よりPSDファイルでダウンロードできます。 各デバイスのサイズ レイアウトを3つ レイアウトを4つ レイアウトを6つ 各デバイスのサイズ まずは、2012年3月現在の各デバイスの幅です。 ※クリックで拡大 ポイント 上段：ポートレイト（縦置き）、下段：ランドスケ
iPhone向け高機能テンプレート集“UiUiKit” – [Mu]ムジログ
iPhone向け高機能テンプレート集“UiUiKit” 2010 年 10 月 18 日 – 12:00 AM category Webサイト開発・運営 tags iPhoneアプリ開発, UI Comments: 0 Trackbacks: 0 この記事を読むのに必要な時間の目安: 約 2 分 iPhone用HTMLテンプレートというよりもiPhone向けWebサイト構築フレームワークといっても過言ではない。 Downloads – iphone-universal – Project Hosting on Google Code 上記からダウンロードして解凍すると、HTML,CSS,画像ファイルがたくさんある。それぞれのHTMLをSafari（ブラウザ）で開くと、それぞれiPhone向けにデザインされた画面が出てくる。 当然のようにiPhoneを傾けてもそれに合わせて横幅調整は自動
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
WordPress - iPhone対応テンプレート －テンプレートキング