TOP  >  人工知能

Tag : 人工知能

2018年09月02日

手書きのワイヤーフレームからHTMLに自動変換してくれるMicrosoft「Sketch 2 Code」

WEBを制作する際のフローとして、まずは手書きでワイヤーフレームを設計してそれらを固めてから、実制作に移るという方は多いのではないでしょうか?今日紹介するのは、手書きのワイヤーフレームからHTMLに自動変換してくれるMicrosoft「Sketch 2 Code」です。

sketch2

こちらは、2018年8月に公開されたもので、現在はailab/Sketch2Code at master · Microsoft/ailab · GitHubにて公開されています。開発者インタビューや実際の利用シーンがまとめられた動画が公開されていましたので以下からご覧ください。

動画は以下から

(さらに…)

続きを読む
posted 11:40  |  
Category: Tool , WebDesign   
このエントリーをはてなブックマークに追加

過去の記事からランダムで表示

2012年10月27日

使える見出しフリーフォント25 from 2012「25 Yet More Free Fonts for Headlines」

見出しに使うフォントは、デザインを決定づける非常に重要なもの。それだけに武器となるフォントはある程度それておきたいものです。今日紹介するのは比較的使いやすいクリエイティブなつかえる見出しフリーフォントをまとめたエントリー「25 Yet More Free Fonts for Headlines (from 2012)」です。


Nexa

シンプルなものから、クリエイティブによったものまで、全部で25のフォントがまとめられていますが、今日はその中からいくつか気になったものを紹介したいと思います。

詳しくは以下

(さらに…)

続きを読む
posted 04:00  |  
Category: WebService   
2013年11月30日

キーワードからUI事例や素材を検索できるWebサービス「UI Cloud」

UI(ユーザーインターフェース)とは、ユーザーがコンピュータを操作する際の画面表示やナビゲーション、全体的な操作感のことを示し、これはWebサイトを不便なく閲覧する上で非常に多くのなウェイトを占めています。今回紹介するのはそんなUIに絞って事例や素材を検索できるWebサービス「UI Cloud」です。

uicloud_0

これは入力したキーワードを基にUIを検索して、表示された結果から各種素材データがダウンロード出来るというもので、クリエイター向けのサービスとなっています。

(さらに…)

続きを読む
2016年05月20日

魅力的なフリーフォントが豊富に揃った「fontbundles / Premium Free Fonts」

たくさんのフリーフォントが常に発信され続けており、どんどんと新しいデザインも登場してきています。そんな中今回は、デザイン性も高く、魅力的なフリーフォントが豊富に揃った「fontbundles / Premium Free Fonts」を紹介したいと思います。

freefont0520

さまざまな種類のフォントの配布をおこなっている「fontbundles」内にて、フリーでダウンロードできるフォントがピックアップされています。

詳しくは以下

(さらに…)

続きを読む
posted 10:00  |  
Category: Font   
2010年07月09日

CSSで作るナビゲーションとボタンのコーディングチュートリアル55「Complete Toolbox: 55 CSS Menu And Button Coding Tutorials」

WEBでは欠かせないナビゲーションやボタン。様々な作り方がありますが、今日紹介するのはCSSで作るナビゲーションメニューの作り方のチュートリアルを集めたエントリー「Complete Toolbox: 55 CSS Menu And Button Coding Tutorials」です。

bulletproof-sliding-doors-css-menu-button-tutorials
Bulletproof CSS Sliding Doors

スライダー用から、タブメニュー、角アールのグラデーションメニュー、動きの付いたアコーディオン、プルダウンなどなど、CSS作れる様々なナビゲーションとボタンが公開されています。全部で55のチュートリアルが公開されていますが、今回はその中からいくつか気になったものを紹介したいと思います。

詳しくは以下

(さらに…)

続きを読む
posted 11:48  |  
Category: WebDesign   
2009年04月05日

illustratorで使えるベクターフリーブラシ「A Huge Compilation of 60 Free Illustrator Brushes」

photoshopのブラシもかなり便利なのですが、イラストレーターを主体にデザインしている人にとってはそこまで複雑な表現でなければ、ベクターで済ましてしまいたいと言う事も多いかと思います。そこで今日紹介するのはillustratorで使えるベクターフリーブラシをあつめたエントリー「A Huge Compilation of 60 Free Illustrator Brushes」です。

illburashs01
Certificate Border

植物から花、レースなどなど様々な表現のブラシが全部で60個紹介されています。今日はその中から実用的で、気になったものをいくつか紹介したいと思います。

詳しくは以下

(さらに…)

続きを読む
posted 12:28  |  
Category: Design , vector   
tag: Design vector
2016年06月07日

ハイクオリティな最新フリーリソースまとめ集「50 Free Resources for Web Designers from May 2016」

webデザイン業界の移り変わりの早い流行と共に、フリーで配布されている素材も常に新しいものがどんどんと登場しています。そんな中今回は、ハイクオリティな最新フリーリソースまとめ集「50 Free Resources for Web Designers from May 2016」を紹介したいと思います。

resources0607_4
Free Isometric Stationery PSD Scene Creator by ZippyPixels – Dribbble

UIやフォント、アイコン、モックアップなど、さまざまな種類の素材が多数まとめられています。気になったものをピックアップしましたので、下記よりご覧ください。

詳しくは以下

(さらに…)

続きを読む
posted 10:00  |  
Category: Design   
2010年10月28日

美しいwebサイトデザインサンプル集「48 Beautiful Web Design Interface From DeviantArt」

美しく、洗練されたwebデザインは、バランスや色の使い方などに強くセンスを感じるもの。そんな中今回紹介するのは、美しいwebサイトデザインサンプル集「48 Beautiful Web Design Interface From DeviantArt」です。


Classica by =badboythemer on deviantART

実際に制作を手がける際に参考になる、きれいめなサイトデザインが48種類紹介されています。またデザインだけでなく、レイアウトや構成なども参考にすることができそうです。中でも気になったデザインをいくつかピックアップいたしました。

詳しくは以下

(さらに…)

続きを読む
posted 08:13  |  
Category: Design , WebDesign   
2016年02月07日

背景パターンやテクスチャを簡単に生成できるオンラインツールまとめ「12 Online Tools to Generate Seamless Background Patterns and Textures」

背景素材として、完成されたさまざまなテクスチャ等が配布されていますが、今回は、すでに用意されたものではなく自身で柄の出方や種類を選定しながら生成まで可能なオンラインツールまとめ「12 Online Tools to Generate Seamless Background Patterns and Textures」を紹介したいと思います。

pattenmker0
PlaidMaker # pa1

背景パターンやテクスチャを簡単に生成できるツールが紹介されています。きになったものをピックアップしましたので、下記よりご覧ください。

詳しくは以下

(さらに…)

続きを読む
posted 10:00  |  
Category: Tool   
2012年04月12日

デザイン制作に使いやすいノートアイコンまとめ「25 Sets of Useful Notes Icon」

アイコンを利用することは、ユーザーがサイトをより快適に利用するための手段の一つ。こだわりを持って選びたいものです。そこで今回紹介するのが、デザイン制作に使いやすいノートアイコンばかりをまとめた「25 Sets of Useful Notes Icon」です。


Notes icons

デフォルメされたデザインがかわいらしいアイコンから、立体感の美しいアイコンまで、さまざななノートアイコンが紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。

詳しくは以下

(さらに…)

続きを読む
posted 11:44  |  
Category: Design   
2017年01月19日

感情・ターゲットなど様々切り口から配色を提案してくれる配色ツール「Culrs」

デザインに置いて色は非常に重要な要素の一つで、その配色でデザイン全体のイメージが左右されるほど。それだけに配色というのは難しい決定頁の一つでもあります。今日紹介するのはそんな難しい配色の手助けをしてくれる、感情・ターゲットなど様々切り口から配色を提案してくれる配色ツール「Culrs 」です。

1

「Culrs」は左側のメニューからEmotions、Target Audience、Type of productsなど選択でき、そこからさらに細分化された項目での色彩パターンを提示してくれます。いくつか試してみましたので以下からご覧ください。

詳しくは以下

(さらに…)

続きを読む
posted 08:30  |  
Category: WebService   

Sponsor

このブログを購読する

facebook
twitter
rss

Designdevelopについて

デザインを開発するという視点からデザイン、WEBデザインに役立つ情報をお伝えします。

ご意見、ご感想、連絡事項があればFacebookページよりお願いたします。

※当サイトのに掲載されている一部画像、スクリ-ンショットに文章に置いては第三十二条で定められる引用の範囲で使用していますが、万が一問題があればFacebookページからご連絡ください。即刻削除いたします。
※本ブログの「プライバシーポリシー」です。

関連サイト

Designdevelopの姉妹ブログ、毎日のインスピレーションに!をコンセプトに、グラフィックデザインからプロダクトデザインまでクリエイティブをテーマに取り上げていくブログ「DesignWorks」を運営中。

【ご注意】「Designworks」の旧ホームページドメインを利用したWEBサイトにご注意ください
Template deisgn by iDEACLOUD inc.
トップに戻る