An accordion is a vertically stacked set of interactive headings that each contain a title, content snippet, or thumbnail representing a section of content.
This design system documents the styles, components and templates available to use on your website. Find out how to get started. How the front end assets (CSS and JavaScript) are organised and compiled is discussed below. ¶CSS CSS is based on Sass (using the SCSS syntax) and is heavily influenced by Andy Bell's CUBE CSS. This has some similarities with the BEM Methodology but with a more judicious
You can now generate designs inside of Figma with AI, with the latest version of the Builder.io Figma plugin. For example, in this prompt, I just said “I want a product page that looks like it's on everlane.com”. Then, you can hit enter, and watch the AI produce design options in real time: Then you can click on your favorite, and it becomes fully editable directly in Figma: Using the Builder.io F
はじめまして!4月からアドビで書体デザイナーとして入社した吉田大成と申します。 私は大学の卒業制作で「はくれい」という明朝体を作ったのですが、その時に「Glyphs」というドイツのグリフス社のフォント作成アプリを使っていました。全ウェイトを含めると5,000字を超えるフォントの制作にGlyphsは欠かせない存在で、はくれいはパス(輪郭線)の描画からフォントデータの出力まですべてこのソフトだけを使って制作しました。 これまで卒業制作の一環としてGlyphs自体をずっと研究していたのですが、フォントの制作と展示準備を並行しながら進めていて、なかなかその研究についてを文章にすることができていなかったので、一度その内容をしっかりまとめたいと考えて、この記事をブログに書こう!という思いにいたりました。 Twitterでつぶやいてみたところ 、うれしいことに「ぜひ読みたい」という反響もあって、 Ado
1293 Games 53131 Screenshots The ultimate reference tool for interface designers. Filter by Materials and Patterns Such as Wood Paper Halftone Tribal Ornate and many more! Browse 120+ Screen Types Title Screen Settings Inventory Area Map Dialogue Shop Mission Log Tutorials & Guides Leaderboards Modals Gameplay & HUD
みなさんは、普段UIをデザインする中で、「アニメーション」についてどれほどの意識を割けているでしょうか。 極端な事を言えば、ほとんどの状況においてUI上でアニメーションは存在しなくても成立してしまいます。 それはなぜかといえば、UIは主にユーザーの入力に対して特定の画面を出力したり、内部ステータスを変更するなどの必要条件を満たすことで目的が成就できてしまうからです。 上の画像のように、入力の示唆と結果の画面さえ描画できていれば、その間を繋ぐアニメーションは必ずしも必要では無いのです。 では、アニメーションの必要性はどこに見い出すべきなのでしょうか。 そもそも不要なものなのでしょうか? OSのガイドラインからアニメーションを考える このような時は世界の御大にご意見を仰ぐのが正攻法です。 まずはGoogleから、Material DesignのUnderstanding motionでは、アニ
社会への眼差しと態度。 クリエーティブというチームプレーの中で自分がどうしたいか? を持ち続けること。 ハイスピードで変化する世の中を広い眼差しで見つめ、自分をアップデートしつづけていくための「環境」それがWHITNEY(ホイットニー)です。 広告からアート作品に至るまで、クリエーティブに関する全てにおいて解決策を提示いたします。
こんにちは。PayPayフリマのデザイナー加藤です。 PayPayフリマはCtoCのフリマサービスです。PayPayで簡単・安心に売り買いできるだけでなく、ユーザー同士が交流・情報交換できる投稿機能や新たな製品情報をユーザー自身が登録できる機能といった他のサービスにはない独自の機能も提供しています。 今回はインターフェースデザインツールFigmaの活用でどのようにUIコンポーネントの管理保守を効率化したのか、PayPayフリマにおけるプロダクト内デザインデータ運用の工夫をご紹介します。 旧Figma運用フローの課題 現在PayPayフリマでは、プロダクト内の画面UIやコンポーネントのデザインデータを、近年リリースされたFigmaの新規機能を活用してより効率的に運用できる体制づくりが進められています。昨年のYahoo! JAPAN Tech Blogの記事でもPayPayフリマのFigma運
A design system is a set of standards, guidelines, and tools that help teams design and build digital products more efficiently and consistently. It serves as a single source of truth for the visual and interactive elements of a product, including typography, color, layout, and functionality. One of the main benefits of a design system is that it promotes consistency across a product or brand. By
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く