Framerで動くモックアップを簡単作成~ Getting started prototyping with Framer. ※このスライドは、2014年6月19日のCSS Niteで話した内容です。 http://cssnite.jp/afterdark/cpi/vol11/
liquid_video
ルール？展 Organized by: 21_21 DESIGN SIGHT, THE MIYAKE ISSEY FOUNDATION In Association with: Agency of Cultural Affairs; Ministry of Economy, Trade and Industry; MINATO CITY BOARD OF EDUCATION Special Sponsor: Mitsui Fudosan Co., Ltd. Exhibition Director Team: Tasuku Mizuno, Syunichi Suge, Miyuki Tanaka Graphic Design: UMA/design farm Space Design: dot architects Online-Experience Design: Yukiya Okuda
【イラストレーター 環境設定 Web DTP 切り替え】やっとできた！イラストレーター環境設定の保存 : ごろうTV
◆ #いきなりHTML 2（レスポンシブ対応） なんと！スライスもコーディングも全自動！イラレからHTML+CSSへ一発出力します ◆ デザイン業界にもRPA！オリジナルスクリプトで時短革命 こんなにラクしてイイんです！お見積もり無料！お気軽にご相談ください ◆ 10倍ラクするIllustrator仕事術〜ベテランほど知らずに損してる効率化の新常識 イラレ使いにこれ1冊！ホントに10倍ラクできます ■ ご注意 ■ 当方で公開しているスクリプトは、Mac のみ、macOS High Sierra ＋ Illustrator 2020（24.3）までの検証となります。これ以降の macOS や Illustrator のバージョン、Windows での検証はできかねますので、ご注意ください。
2016 年の WordPress
Noel Tock一年前、2015年の WordPress という記事を公開しました。振り返ってみて、実現されるスピードはさまざまでありながらも、そこで書いた予言の大部分が、正確であったことを嬉しく思います。ここで読むことができます。 2015年は、WordPress とそのエコシステムにとって、またしても大きな年となりました。世界中のすべてのウェブサイトのうち、WordPress が使われているサイトの割合が 25% を超え、WordPress 自体にもレスポンシブイメージや REST API の導入が成されました。周辺のエコシステムも力強く成長し、たとえば Automattic による WooCommerce の買収、30万ドルくらいであったと言われていますが、こうした出来事を私たちは目撃しました。WordPress.org 上にある4万以上のプラグインは10億回以上ダウンロードされる
わたしが広告を掲載しない理由
このサイトに始めて訪れた方は、広告がないことに気付いたでしょうか？ 以前から読者である方のなかには、このサイトにはなぜ広告がないのか不思議に思っている方もいるかもしれません。現在の Web 広告には以下 5 つの問題を抱えていると考えており、掲載を控えています。 技術の問題 ユーザー体験の問題 デザインの問題 コンテンツの問題 モラルの問題 読者の足を引っ張る広告たち 何度か広告ネットワークから掲載オファーをいただいたことがあります。多くの場合、複数の JavaScript を埋め込む必要があり、パフォーマンスへの多大な影響がでることから掲載を断っています。うちのような小さなサイトであれば大きな変化はないかもしれません。しかし、ちょっとしたパフォーマンスへの負債が積み重なれば読者への影響も多大なものになります。 上記の数値は、ある有名な日本のブログメディアのトップページのファイルサイズとリ
フロントエンドできない人が、フロントエンドやりすぎだ。あと、Vanilla.jsが便利だ。 - nobkzのブログ
最近、なんというか、フロントエンド勉強会に出席する度に、「フレームワークじゃねぇんだ! MVC設計がな! 」とか言い続けている気がする。たくさんフレームワークが出てきて、○○フレームワークの問題とか、開発の困難の話を聞く度に、自分の設計を棚に挙げて、「これは、フレームワークがスケールできないせいだ!」「jQueryが糞」とか言ってて、「何言ってんの?コイツ?」みたいな気分になる。 最近になって、なんでこの状況がいつまでたっても変わらないんだろう? って理由が分かってきた。フロントエンドできない人が、フロントエンドやりすぎなのだ。 なんでフレームワーク使うの? そもそも、なんでフレームワークを使うか?ってことに答えられない人が多い気がする。というか、大抵「上司が決めたから」とか「チームで決まっているから」という答えが返ってくる。そもそも、フレームワークを強制して学習させる環境になっている現場
【翻訳】デザインエンジニアリング - MOL
Original：Design Engineering（2014-11-25）by Jonathan Snook JavaScriptだけがフロントエンド開発ではない。それはデザインとディベロップメントの技術が人種のるつぼのように融合したものである。それはアクセシブルなUIを実装するためであり、Web標準を受け入れるものである。 — Matt Hill Shopify Adminの開発に関して言えば、最近まで2つの専門職、つまりデザイナーとエンジニアを受け入れていた。今では3つめの専門職がある、しかしながらそれが確かなものとして認識されるまで時間がかかった、フロントエンドデベロッパーである。フロントエンドデベロッパーのスキルはデザインとエンジニアリング両方にまたがっている。これまでクオリティの高いフロントエンドコードをフロントエンドデベロッパーの助けもなしに書けるデザイナーを雇えて、私たち
チャットワークの、これからのフロントエンド戦略 | チャットワーククリエーターズブログ
こんにちは！ChatWork CTOの山本です。 チャットワークのバックエンドをPHPからScalaへの切り替えることを決断し、現在は移行に向けての大プロジェクトが進行中です。 バックエンドはScalaにしていく。じゃあフロントエンドはどうするの？ということで、今回はチャットワークのフロントエンド開発における今後の戦略を書いてみようかと思います。 現在のフロントエンドにおける課題現在のJavaScriptコード量は、ざっと5万行ほどになっています。(OSSライブラリ、言語キーなどを除く。たぶん大規模・・ですよね？) 約5年前の開発スタート時より、素のJavaScriptとjQueryをベースにゴリゴリと書き重ねられ、これぐらいのコード規模になったソースコードはご想像通りメンテナンスコストがかなり高くなってしまっています。。。 バックエンドの刷新に伴い内部APIも一新されるため、どうせ大幅に
Framer: Create a professional website, free. No code website builder loved by designers.
Framer is the site builder trusted by leading startups and Fortune 500 companies. Build fast and scale more easily with an integrated CMS, analytics, localization, and SEO. Framer is the site builder trusted by leading startups and Fortune 500 companies. Build fast and scale more easily with an integrated CMS, analytics, localization, and SEO.
carousel.md
carousel.md これはWeb Accessibility Advent Calendar 2013 14日目の記事です。 とはいえアクセシビリティの概念的な側面には詳しくないので小手先の内容になってしまい、そうそうたる記事の中で恐縮。 JSで表示を制御するカルーセルについて、非JSの環境で使うためにはどうすればいいか今一度考えてみました。 非JS環境での問題 非JS環境での一番の問題は、そもそもカルーセルは表示できる領域に対してコンテンツが多い場合に利用されるものなので、その中身をすべて表示するには領域が足りない、という点です。（あたりまえですが） そんなわけでできるだけ他のデザイン要素に影響しない、カルーセルの領域の中で収まる代替表現が必要になります。 作ってみたもの サンプル1 サンプル2 1つ目のサンプルではカルーセルのページを重ねて並べつつ、 マウスオーバーで広がるようにし
[JS]最近のウェブサイトで見かける面白い仕掛けを実装するスクリプトのまとめ
fullPage.js ポートフォリオや企業のプロモーションでもよく見かける1ページで構成されたサイトで、フルスクリーンの垂直スクロール、そして水平のスライドにも対応したウェブサイトを作るためのスクリプト。 こういう作りは特にタブレットで操作がしやすいですね。 FancyScroll.js スマフォやタブレットのようにページの終わりまでスクロールした際にバウンドするのをはじめ、ちょっと面白いさまざまなエフェクトをスクロールに与えるスクリプト。
The Famous Slide Out Sidebar Navigation Javascript Solutions
We have seen different kinds of navigation solutions for responsive layouts. The most common solution would be transforming main navigation menu into drop down menu. However, with the popularity of Apps on mobile platform, they are bringing one of the emerging nav UI pattern into web, they called it Sidebar Navigation. Sidebar navigation can be seen on facebook, Path and Gmail iOS and Android apps
【インタビュー記事】日本人初のDribbblerに聞く、優れたUIデザイナーになる為の秘訣とは: 前編 | Goodpatch Blog
以前にもMEMOPATCHで紹介した（「優れたアイコンデザイナーまとめ【Dribbble編】」）でも紹介したDribbble、ここに作品を投稿できるのは招待を受けた本当に優れたデザイナーだけです。現在Dribbbleに投稿できる日本人デザイナーは90名弱ほどいるのですが、その中で初めてDribbble投稿者（通称: プレイヤー）になったのが今回インタビューを引き受けてくださったのが、貫井伸隆氏。今回貫井氏にUIデザインについて色々伺ってみたいと思います。 元々はコーダーでサイトの動きを突き詰めいていくうちにUIデザインに出会った ーー貫井さんは日本人初のDribbblerということなのですが、そこに至るまでの経緯を教えいただけますか 中学校まではシェフやパティシエを目指していました。料理の立体造形や色味の美しさ、お皿とのバランスなどに興味があったんです。 その流れで高校は飲食の専門高校を受
人や動物のシルエット
You came here for some really cool CSS text effects that will help you make amazing web typography for your websites. In order to successfully give a website a look that is more visually impressive, designers always concentrate on placing more emphasis upon typography that is both stylish and neat in nature. These same designers used to depend upon programs such as Photoshop to accomplish this; ho
NYタイムズも注目！「データ×デザイン」を実現するデータビジュアリゼーション ライブラリ「d3.js デザイン会社 ビートラックス: ブログ
世界中でデータがどんどん増えていく中でデータをうまく扱うことはとても重要になってきています。そんな中、New York Timesが積極的に活用していたり、Githubのwatch数ランキングで上位にランクインしていたりと最近人気急上昇中のデータをビジュアライズする為の「d3.js」というライブラリがあります。 本日はこの「データｘデザイン」をwebサイト上で実現する為のjavascriptライブラリ”d3.js”について紹介したいと思います。 このライブラリを使うことで、今までなかなか難しくてできなかったウェブ上での「データの可視化」が手軽にできるようになり、複雑なデータを直感的に理解できるようなサイトが作りやすくなります。早速ですがこのd3.jsというものがどういうものかをなんとなく感じるには実際に動いているデモを見て頂くのが早いので以下をご覧下さい。 オバマ大統領の国家予算案詳細 (
The best of 2012 for designers
In 2012, we covered a ton of new apps, resources, and more for designers and developers. In fact, we covered nearly 500 such resources!So rather than yhou having to go back through our archive of posts, we’ve gathered up the best of what was new over the past year in one place! We’re not including […] In 2012, we covered a ton of new apps, resources, and more for designers and developers. In fact,
Modern Syntax
毎度お馴染みのBrick TechnologyさんによるLEGOで作った車を使った有名な交通流実験です。ぼーっとみていると地味に楽しいです。 交通流実験というのは、渋滞解消や安全確保を目的に、車両や歩行者の動きを実際の道路またはシミュレーション上で分析する手法です。 各トラックは人間の行動を模倣するようにプログラムされており、他の車に近づくと減速するなどの反応します。 わかっちゃいるのですが、注意散漫なドライバーや不規則な運転をするドライバーがいるととたんに渋滞が発生するってのがよくわかると思います。 しかし、すべてもトラックにプログラムをダウンロードする作業だけでもたいへんだろうなあ、と思う次第です。 今回のモダシンラジオも前回に引き続き私の一人語りの回で、最近観た以下の4本の映画について17分50秒でしゃべっております。 ・プロジェクト・ヘイル・メアリー ・アメリと雨の物語 ・全知的な
スマホアプリ開発の最前線で使われている、UIデザインメソッド20(3) デベロッパーに聞く、今日から使えるJavaScript 高速化術(前編)
アプリ制作の技術者から学ぶ当連載や、中村洋基氏をはじめとするクリエイターが登壇する11月17日（土）開催のセミナー、中国・上海のWeb制作会社訪問ツアーなどの豪華賞品が当たるアプリアワードを行う「TapApp(タップ＊アップ)プロジェクト」と連動した連載第3回は、実際にソーシャルゲームのコーディングを行っているサイバーエージェント(以下、CA)のデベロッパーに、すぐに使えるJavaScript高速化のテクニックについて聞いた。 高速化がもとめられるスマホ用Webアプリ開発の現場 スマートフォン用ゲームというと、ネイティブアプリケーションの形で提供されるものをまず思い浮かべるかもしれないが、最近ではソーシャルゲームを中心に、ブラウザ上で動作するWebアプリケーションとして提供されるタイトルが続々と登場している。ユーザーがアプリをダウンロードする手間がなく、iPhone、Androidなど複数
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ツクロア - DESIGN LAB
Mr.doob
