はてブログ

はてなブックマーク新着エントリーの過去ログサイトです。



タグ グリッド

新着順 人気順 5 users 10 users 50 users 100 users 500 users 1000 users
 
(1 - 25 / 206件)

UI要素をグリッドではなく、サークル・放射状、曲線状にレイアウトできるCSSのフレームワーク -Orbit

2024/12/05 このエントリーをはてなブックマークに追加 10 users Instapaper Pocket Tweet Facebook Share Evernote Clip 線形 Orbit グリッドベース レイアウト 従来

ラジアルUIとは、従来のグリッドベースまたは線形のレイアウトとは異なり、要素がサークル・放射状のパターンでレイアウトされたUIです。 このラジアルUI、あらゆる要素をサークル・放射状、または曲線状のパターンでレイアウトできるCSSのフレームワークを紹介します。 Orbit Orbit -GitHub Orbitの特徴 Orbitのデモ Or... 続きを読む

Reactで使えるヒートマップライブラリ3選

2023/07/28 このエントリーをはてなブックマークに追加 6 users Instapaper Pocket Tweet Facebook Share Evernote Clip React ライブラリ ヒートマップ ツール 可視化

7月27日、Reactのための最高のヒートマップライブラリについて紹介します。 ヒートマップは、データを色分けされたグリッドで可視化するための強力なツールです。 この記事では、Reactでヒートマップを作成および操作するために使用できる3つの人気のあるライブラリ、react-heat-map、D3.js、およびSyncfusionを紹介しま... 続きを読む

AI最大の課題「フレーム問題」解決の糸口をグリッドが開発!強化学習とアンサンブル学習を連携 米国物理学協会発刊学術誌が掲載 - ロボスタ ロボスタ - ロボット情報WEBマガジン

2022/08/02 このエントリーをはてなブックマークに追加 14 users Instapaper Pocket Tweet Facebook Share Evernote Clip 糸口 ロボスタ アンサンブル学習 深層強化学習 成果

シェア 0 ツイート 0 はてブ 0 株式会社グリッドは、エネルギー分野における「不確実な環境における深層強化学習による最適化」の開発に成功した。これは現在のAIにとって最大の課題のひとつとされている「フレーム問題」を解決する糸口になる、と言う。そして、その成果を、米国物理学協会が発刊する「Journal of Renew... 続きを読む

全部、完全に商用利用無料! UIデザインに適した400種類以上のSVG・Figma用も揃ったシンプルでかわいいアイコン素材 -Doodle Icons

2022/03/14 このエントリーをはてなブックマークに追加 277 users Instapaper Pocket Tweet Facebook Share Evernote Clip UIデザイン かわいいアイコン素材 SVG 全部 fig

アイコン用のグリッドを使用して手描きされた、ちょっとラフなかわいい感じにデザインされたアイコン素材を紹介します。 15のカテゴリに、400種類以上のアイコンがセットになっており、個人でも商用プロジェクトでも完全に無料で使用できます。フォーマットは.png, .svg, .figが揃っているのも便利ですね。 Doodle Icons... 続きを読む

ビル・ゲイツ氏「2、3年以内にバーチャル会議の大半がメタバースに移行」と予測 | Mogura VR

2021/12/13 このエントリーをはてなブックマークに追加 9 users Instapaper Pocket Tweet Facebook Share Evernote Clip メタバース 台頭 マイクロソフト 大半 予測

マイクロソフトの共同創業者であるビル・ゲイツ氏は、働くことの未来がメタバースの台頭によってどのように変化するかを予測しています。個人ブログの中で、「今後2、3年のうちに、ほとんどのバーチャルミーティングは、2Dのカメラ画像のグリッドから、デジタルアバターによる3D空間であるメタバースに移行するだろう」... 続きを読む

グリッドをロボットが走り回る近未来感あふれる倉庫。釣具のハヤブサが公開

2021/12/06 このエントリーをはてなブックマークに追加 13 users Instapaper Pocket Tweet Facebook Share Evernote Clip はやぶさ 釣具 ロボット 公開

続きを読む

レスポンシブ対応のレイアウトやコンポーネントだけを実装するCSSのシンプルなコードのまとめ -SmolCSS | コリス

2021/07/16 このエントリーをはてなブックマークに追加 17 users Instapaper Pocket Tweet Facebook Share Evernote Clip コリス パディング コンポーネント CSS レイアウト

Webサイトでよく使用するレスポンシブ対応のシンプルなグリッドやサイドバー、フレキシブルなパディングの実装、ギャラリーやカード型レイアウトなど、レイアウトやコンポーネントを実装するCSSのコードを紹介します。 CSSの実装は年々進化しており、さまざまなプロジェクトで使用できるシンプルで最小限のコードをまと... 続きを読む

これなら分かりやすい!Webサイトのデザイン仕様書・指示書の作り方 | コリス

2021/06/17 このエントリーをはてなブックマークに追加 411 users Instapaper Pocket Tweet Facebook Share Evernote Clip デベロッパー コリス フォント 各UIコンポーネント 指示

デザイナーがWebサイトのUIを実装する際にデベロッパーに渡すデザイン仕様書・指示書の作り方を紹介します。 仕様書を作成する基本ツール、指示に適したフォントやカラー、グリッドや要素間の距離を自動的に計算するツールをはじめ、レイアウトや各UIコンポーネントのデザイン仕様の記述例まで、デザインを仕様化する解... 続きを読む

最新版、レスポンシブ対応のレイアウト・グリッドデザイン徹底解説 | コリス

2020/12/04 このエントリーをはてなブックマークに追加 17 users Instapaper Pocket Tweet Facebook Share Evernote Clip ワークフロー コリス 主流 グリッド設計 バリエーション

レスポンシブ対応のグリッド設計、レイアウトのバリエーション、デスクトップやスマホやタブレットの最近の状況に合わせたデザイン方法を紹介します。 グリッドの基礎知識をはじめ、最近主流のレイアウト、デザイナーがワークフローでグリッドをどのように適用させるかなど詳しく解説されています。 Responsive Grid Des... 続きを読む

Webページやスマホアプリでよく使用される代表的な5つのレイアウトをCSS Gridで実装するテクニック | コリス

2020/12/01 このエントリーをはてなブックマークに追加 21 users Instapaper Pocket Tweet Facebook Share Evernote Clip コリス ブッダ レスポンシブ CSS Grid レイアウト

Webページやスマホアプリでよく使用される代表的な5つのレイアウトをCSS Gridで実装するテクニックを紹介します。 ヘッダ・コンテンツ・フッタを積み重ねたもの、12カラムのグリッド、メディアクエリなしのレスポンシブなど、実際によく使用されるレイアウトばかりです。 CSS Gridを使用すると、今まで少し複雑だったレ... 続きを読む

しっかり理解しておくと便利なCSSのテクニック、minmax()関数の使い方 | コリス

2020/11/26 このエントリーをはてなブックマークに追加 171 users Instapaper Pocket Tweet Facebook Share Evernote Clip minmax コリス UIコンポーネント CSS 関数

minmax()はCSSの関数で、要素サイズの最小値と最大値を定義することができます。カードを配置するグリッド、記事を中央配置で画像を幅いっぱいにするフルブリードなど、ページのレイアウトやUIコンポーネントの実装に非常に便利です。 CSS Gridにおけるminmax()関数の実用的で、便利な使い方を紹介します。 A Deep Dive ... 続きを読む

F1 Topic:クラッシュしたフェルスタッペンがガレージに戻らず、グリッドで修理を試みた理由 | F1 | autosport web

2020/07/21 このエントリーをはてなブックマークに追加 15 users Instapaper Pocket Tweet Facebook Share Evernote Clip フェルスタッペン レッドブル ガレージ 自力 マックス

ガレージを出て、ダミーグリッドへ向かうためにコースを1周するレコノサンスラップでタイヤバリアにクラッシュしたレッドブル・ホンダのマックス・フェルスタッペン。なんとか自力でマシンを再走行させたものの、フロントウイングは脱落し、左フロントサスペンションにダメージを負った姿を見て、多くのファンがピットイ... 続きを読む

Bootstrap 5 alphaがついにリリース!注目すべき新機能、jQueryは削除、IEすべてのバージョンのサポート終了 | コリス

2020/06/18 このエントリーをはてなブックマークに追加 5 users Instapaper Pocket Tweet Facebook Share Evernote Clip Bootstrap jQuery コリス Alpha版 こん

先日の記事で春後半の夏前にリリースされるとお伝えした通り、Bootstrap 5のalpha版がついにリリースされました! IEすべてのバージョンのサポート終了、jQueryの削除をはじめ、注目すべき新機能を紹介します。 Bootstrap v5 Bootstrap v5の特徴 Bootstrap v5のダウンロード・インストール Bootstrap v5のグリッドやコン... 続きを読む

水彩調の島を作るSLG『Townscaper』6月にSteam早期アクセス配信開始へ。ブロックを置くだけで生まれていく美しい島 | AUTOMATON

2020/06/01 このエントリーをはてなブックマークに追加 11 users Instapaper Pocket Tweet Facebook Share Evernote Clip AUTOMATON SLG 水面 土台 プレイヤー

『Townscaper』は、極めてシンプルな島づくりシミュレーションゲームだ。「たくさんの建物とたくさんの美しさ。以上」とストアページで説明されているように、課題が与えられるわけでも、ゴールが設定されているわけでもない。プレイヤーはグリッドの設定された水面に土台を敷き、自由に建物を建築することができる。公... 続きを読む

CSSでノートの罫線やグリッドなど、さまざまな要素の背景にパターンを簡単に実装できるライブラリ -pattern.css | コリス

2020/04/23 このエントリーをはてなブックマークに追加 26 users Instapaper Pocket Tweet Facebook Share Evernote Clip ジグザク コリス 罫線 ドット CSS

ページ全体、テキストやボックスなどのさまざまな要素の背景に美しいパターンを簡単に実装できるスタイルシートのライブラリを紹介します。 ノートみたいな罫線、ドット、チェック、グリッド、ジグザグなど、要素にclass名を与える...記事の続きを読む 続きを読む

【1分で読める書評】 『GRIT やり抜く力』 アンジェラ・ダックワース | 1分で読める書評サイト 本のび教室

2020/01/11 このエントリーをはてなブックマークに追加 5 users Instapaper Pocket Tweet Facebook Share Evernote Clip Grit アンジェラ・ダックワース 書評 才能 究極

この記事は約1分で読めます。 「自分には才能がない・・・」と嘆いているあなたにオススメです。 紹介する本はこちら。 『GRIT やり抜く力』 アンジェラ・ダックワース ダイヤモンド社 やり抜く力 GRIT(グリット)――人生のあらゆる成功を決める「究極の能力」を身につける created by Rinker Amazon この本を読めば、才能... 続きを読む

さくらインターネット社長が語る、「電力は止まるを前提に、将来は自立したグリッドを」 | 日経 xTECH(クロステック)

2019/10/06 このエントリーをはてなブックマークに追加 10 users Instapaper Pocket Tweet Facebook Share Evernote Clip xTech 電力 クロステック 日経 前提

2018年9月6日の北海道胆振東部地震によって約60時間のブラックアウトを乗り越えたデータセンターがある。さくらインターネットの石狩データセンターだ。クラウド時代となった今、データセンターは生活の生命線ともいえる重要な社会インフラとなった。地震だけなく、極地的な豪雨や繰り返される台風被害など自然災害によ... 続きを読む

ダークモードもサポート!シンプルで拡張性も備えた超軽量のプログレッシブCSSフレームワーク -Cutestrap | コリス

2019/09/29 このエントリーをはてなブックマークに追加 32 users Instapaper Pocket Tweet Facebook Share Evernote Clip class CSSフレームワーク UIコンポーネント コリス

シンプルなHTMLにclassを加えるだけで、さまざまなUIコンポーネントやグリッドが実装できる超軽量(2.7Kb)のCSSフレームワークを紹介します。 プログレッシブ・エンハンスメントが採用されており、新旧ブラウザの見え方を最適化して表示されます。 Cutestrap Cutestrap -GitHub Cutestrapの特徴 Cutestrapのデモ Cutest... 続きを読む

イラストを使わずに、Webページに斜めから俯瞰したアイソメトリックをつくりだすCSSライブラリ -IsometricSass | コリス

2019/09/04 このエントリーをはてなブックマークに追加 30 users Instapaper Pocket Tweet Facebook Share Evernote Clip アイソメトリック コリス CSS ライブラリ CSSライブラリ

アイソメトリックの斜めから俯瞰したイラストなどをよく見かけますね。そのアイソメトリックをWebページにつくりだすCSSのライブラリを紹介します。 HTMLは非常にシンプルで、要素をアイソメトリックにしたり、斜めのグリッドを配置したり、アニメーションさせたりできます。 IsometricSass IsometricSass -GitHub Isome... 続きを読む

「GRIT」とは? 成功者に共通するやり抜く力の伸ばし方 | ライフハッカー[日本版]

2019/07/08 このエントリーをはてなブックマークに追加 49 users Instapaper Pocket Tweet Facebook Share Evernote Clip Grit ライフハッカー スティーブ・ジョブズ 英語講師 成功

「GRIT(グリット)」という言葉を聞いたことはありますか? 日本語では「やり抜く力」と訳され、後天的に身につけられるライフスキルです。 世界で成功をおさめている、マイケル・ジョーダン、スティーブ・ジョブズもこの力を身につけていたと言われています。 今回は、このやり抜く力「GRIT」の意味と伸ばす方法を、英語講師... 続きを読む

目標は“Indeedのレコメンド版”、AI転職エージェント「GLIT」が6300万円を調達 | TechCrunch Japan

2019/05/16 このエントリーをはてなブックマークに追加 15 users Instapaper Pocket Tweet Facebook Share Evernote Clip Indeed Carat AIエージェントサービス 調達 目標

AIエージェントサービス「GLIT(グリット)」を提供するCaratは5月16日、複数の投資家を引受先とした第三者割当増資により、6300万円を調達したことを明らかにした。 プレシリーズAとなる今回のラウンドに参加したのは求人サイトなどを展開するキャリアインデックスのほか、杉山慎一郎氏、高梨大輔氏、マイナースタジオ... 続きを読む

リズムから考えるJ-POP史 第3回:90年代末の“ディーヴァ”ブームと和製R&Bの挑戦 - Real Sound|リアルサウンド

2019/04/13 このエントリーをはてなブックマークに追加 50 users Instapaper Pocket Tweet Facebook Share Evernote Clip ディーヴァ TRF J-POP史 ブーム リズム

「リズムから考えるJ-POP史」連載第3回 リズムから考えるJ-POP史 第3回:90年代末の“ディーヴァ”ブームと和製R&Bの挑戦 前回は小室哲哉の仕事についてtrfを中心に論じ、小室を「90年代を通じて日本人の『BPM感覚』と『16ビートのグリッド』を規定した」プロデューサーと位置づけた。続いて取り上げるのは、1996年ごろ... 続きを読む

Vue.jsにも対応の優れ物!高さが異なるカードでもグリッドにレイアウトできる超軽量ライブラリ -Magic Grid | コリス

2019/01/16 このエントリーをはてなブックマークに追加 166 users Instapaper Pocket Tweet Facebook Share Evernote Clip コリス Flexbox Vue.js 動的コンテンツ 一定

カードの高さが常に一定であれば、CSS GridやFlexboxで簡単に実装できます。しかし、ユーザーが作成したデータを使った動的コンテンツでは高さが同じになることはほとんどありません。 カードの高さがそれぞれ異なる動的グリッドを簡単に実装できる超軽量JavaScriptライブラリを紹介します。 動的コンテンツはもちろん、... 続きを読む

Chromeの新しい機能拡張が便利すぎる!デザイナーやディレクター向けの新しいデザインツール-ProjectVisBug

2018/11/29 このエントリーをはてなブックマークに追加 656 users Instapaper Pocket Tweet Facebook Share Evernote Clip Chrome デザイナー ディレクター向け アイデア テキスト

VisBugはChromeの機能拡張で、ブラウザに表示したページのデザインやコンテンツを検証・編集できます。グリッドの確認はもちろん、要素を移動させたり、入れ替えたり、別の画像にしたり、テキストを編集したり、カラーを変更したりなど、さまざまなアイデアを実行・テストすることができます。 制作や検証時だけでなく、... 続きを読む

備えておくと便利!CSS Flexboxの各プロパティ、グリッドを実装するコードがまとめられたSassのMixin | コリス

2018/11/19 このエントリーをはてなブックマークに追加 58 users Instapaper Pocket Tweet Facebook Share Evernote Clip Mixin Sass コリス CSS flexbox コード

CSS Flexboxの各プロパティ、レスポンシブ対応のグリッドや垂直・水平の揃えなど、便利なコードがまとめられたSassのMixinを紹介します。 CSS Flexboxの各プロパティがまとめられたSass Mixin CSS Flexboxでグリッドを実装するコードがまとめられたSass Mixin CSS Flexboxの各プロパティがまとめられたSass Mixin flexbo... 続きを読む

 
(1 - 25 / 206件)