イマドキのJavaScriptの書き方2018
PySpa統合思念体です。これからJavaScriptを覚えるなら、「この書き方はもう覚えなくていい」（よりよい代替がある）というものを集めてみました。 ES6以降の難しさは、旧来の書き方にプラスが増えただけではなく、大量の「旧来の書き方は間違いを誘発しやすいから非推奨」というものを作り出した点にあります。5年前、10年前の本やウェブがあまり役に立たちません。なお、書き方が複数あるものは、好き嫌いは当然あると思いますが、あえて過激に1つに絞っているところもあります。なお、これはこれから新規に学ぶ人が、過去のドキュメントやコードを見た時に古い情報を選別するためのまとめです。残念ながら、今時の書き方のみで構成された書籍などが存在しないからです。 たぶん明示的に書いていても読み飛ばす人はいると思いますが、すでに書いている人向けではありません。これから書くコードをこのスタイルにしていくのは別にいい
JavaScriptを言語仕様から把握し、ライブラリに振り回されない漢を目指す人に贈るJavaScriptの基礎 - Qiita
JavaScriptを言語仕様から把握し、ライブラリに振り回されない漢を目指す人に贈るJavaScriptの基礎JavaScript 個人的に本とかネットで勉強していたものを、ここにまとめていたのですが、せっかくなのでQiitaにも投稿します。 間違いなどお気付きの点があればご指摘をお願いいたします。 JavaScript(以下JS) ES6 = ES2015 とする(呼び方多すぎ) 変数と定数の定義 基本的に const で定義するようにし、どうしても必要な時だけ let を使うと事故を減らせる var はES6で書けるのであればもう使わなくて良い let 変数を宣言する。宣言できるのは一度だけ 宣言時に初期化を行わなくてもエラーにはならない(中身はundefinedとなる) 値の再代入は可能だが、再宣言はエラーになる const 定数を宣言する。宣言と同時に必ず初期化する必要がある 値
アニメーションの調味料「イージング」の使い分けレシピ (透明度、UI、音量) - feb19
アニメーションの調味料「イージング」の使い分けレシピ (透明度、UI、音量)date2016.12.1(Thu.)tagsflashactionscript この記事は FLASHer Advent Calendar 2016 1日目の記事です。 FLASHer とはAdobe Flash (現 Adobe Animate) を使用している / 使用していたデザイナー、エンジニアの総称です。Flasher はそのまま訳すと「露出狂」という意味があります。 2016 年現在、前者 GEEK 民族の浄化が行われたので、インターネットで検索をかけると本来の意味での露出狂の画像が見ることができます。会社で検索をかけるのは気をつけて下さい。(なお、本当に露出していた伝説の FLASHer がいます。気になる方は Flasher 露出 で検索) なぜ FLASHer である GEEK 民族浄化が起きた
SVGのオブジェクトごとにCSSで色を切り替える - わすれたあかんえ
デザインpsdを見ながらhtmlでコーディングするとき、たくさん画像を書き出しますよね。 たとえばpngのアイコンを作る場合、形が同じでも色が違えばpngファイルをたくさん書きださなければいけません。色だけ変えたものをひとつずつ、@2xサイズも用意してちまちまと……書き出して…… やってらんないっすよ！ せめて、形が同じなら使いまわしたい…… そう！SVGを使えば、同じオブジェクトを使ってCSSで色だけ変えたものを量産できるのです！ 「それだったらwebフォントでいいじゃん」と思われるかもしれませんが、webフォントはアイコンひとつにつき1色しか使えませんよね？SVGでやればアイコンひとつでも複数色使うことができます。 このSVGアイコンを使いまわして、 こんなかんじでカラフルなアイコンを量産しますよー！ ベクターでアイコンを作成 アイコン作るのがめんどくさい人はicomoonから適当なア
エルビス演算子でスマートに変数を初期化 - Qiita
なんてことはない。PHP5.3から登場したエルビス演算子を知ったので試してみたというだけ。 注意：コメントによりよい手法が書かれています 背景 三項演算子は可読性を落とすか を読ませていただきまして、今回の話に至りました。 エルビス演算子とは と記述すると以下のように実行される。 aがtrue、または真と判断できる値であればその値が返却され、bは評価されない aがfalse、または偽と判断できる値であればbが評価され、返却される 三項演算子の短縮形っぽいけどこんな書き方も出来る模様。
超定番！下記ご確認ください【英文ビジネスメール】 - Webデザイナーのビジネス英語備忘録
「下記ご確認ください。」 「詳細は下記の通りです。」 「以下参照ください。 」 などなど、メールでの鉄板フレーズ。 テンプレで覚えてしまってます。 メールでよく使う一文をまとめました。 ポイントは、「below」「as below」「following」３つの単語を使う事です。 使い方を覚えてしまえば、すぐ応用できます。 お急ぎの方は、下記例文をコピペしてお使いくださいね。 below 「下記、以下 」 例文 as below 「下記・以下の通り、以下のように 」 例文 following 「次の、下記の」 例文 as above 「上記の」 スポンサーリンク below 「下記、以下 」 belowは名詞の後ろ（対象の後ろ）につけます。 文末につけることが多いです。 例文 Please check below. 下記ご確認ください。 Please see below for the de
CSS3での背景指定方法のまとめ
CSSであれこれやっていたら、まず間違いなく使うであろう背景関連のプロパティ。 CSS3ではこれまでより多くの指定ができるようになります。 それらの新しいプロパティや値はいったいどういうものなのか、調べてみました。 主に参考にしたのは以下の2つです。 CSS Backgrounds and Borders Module Level 3現在の仕様です。CSS 背景 & ボーダー モジュール Level 32011年2月15日版の仕様の日本語訳です。プロパティと値の説明はこちらを参考にしました。背景のレイヤー背景は複数のレイヤーを持つことができ、レイヤーの数はbackground-imageに指定されたカンマ区切りの値の数によって決められます。noneの指定も一つのレイヤーを生成します。 背景レイヤーの重なり方ですが、初めに指定したものから手前に来ますので、注意してください。 例として、下のr
[PHP] if文を短く書いてスッキリさせる | IT女子のお気に入りフォルダ
条件を判定して処理をするif構文の記述方法についてのメモ。 基本的な使い方はこう。else以下は省略できます。 if (条件式) { // 条件が真(true)のときの処理 } else { // 条件が偽(false)のときの処理 } HTMLの中にPHPを直接書いたりする場合には、上のように波括弧「{}」で数行書くより、もっとスッキリ書いた方が見やすくなります。 if文のいろいろな記述 波括弧を使ったオーソドックスなif文 if ($lang == 'Jp') { echo 'こんにちは'; } else { echo 'Hello'; } コロンを使ったif文 if ($lang == 'Jp') : echo 'こんにちは'; else : echo 'Hello'; endif; 以下では伝わりにくいですが、コロンを使った記述ではif文内の処理が長いHTMLになっても見やすくなり
![[PHP] if文を短く書いてスッキリさせる | IT女子のお気に入りフォルダ](https://cdn-ak-scissors.b.st-hatena.com/image/square/28a830c8c472ece97f0683f02c48ce3adaa62a20/height=288;version=1;width=512/https%3A%2F%2Fsachips.byeto.jp%2Fwp%2Fwp-content%2Fuploads%2F2015%2F08%2Fnamitosunahama.jpg)
Sketchの使い方: 初心者がマスターしておきたいSketchでのデザイン作業がぐっと効率的になるチップス | コリス
10 Sketch Tricks for Designers 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。 レイヤー間でスタイルをコピペ レイヤーの移動 カラーピッカー 角丸の半径を個別に設定 再利用できるシンボル ツールバーのカスタマイズ iOSデバイスでデザインレビュー Sketchの便利なプラグイン Sketchでプレゼンテーション iPhone, iPadの画面を録画 レイヤー間でスタイルをコピペ レイヤーに同じデザインをコピペしたい時は、カラーコードなどをコピペするのではなく、スタイルをレイヤー間でコピペできます。 レイヤー間でスタイルをコピー ⌘ + Option + C レイヤー間でスタイルをペースト ⌘ + Option + V レイヤーの移動 レイヤーを上下に移動させたい時は、ドラッグ&ドロップの代わりにキーボード
Google Apps Scriptを使って、スプレッドシートの内容をSlackに通知する ｜ Tips Note by TAM
2016.02.26 Google Apps Scriptを使って、スプレッドシートの内容をSlackに通知する 社内で、MTGの司会を当番制にしようということで、スプレッドシートで当番表をこさえたのですが、何かしら通知機能があるといいよなぁということでやってみました。 Google Apps Script（以降、GAS）を使って、当番表の内容をSlackに通知する、のです。 スプレッドシートの画面から、GASはどこで確認できるかというと、「ツール」から「スクリプトエディタ」を選択します。 そうすると、このような画面が ↓ ※ ここにあるキャプチャの内容で、デモを用意しようと思ったのですが、閲覧権限では再現できず、セキュリティ的な観点で断念…。 スプレッドシート内の値を処理/取得 ③の内容をどのように取得しているかというと、GASとJavascriptを使って、次のような記述をしております
VLOOKUP関数は使うな！誰も教えてくれないExcel関数の便利な使い方（第1回） | ウィルゲート
今回はいつもの記事とは毛色を変えて、普段の業務に使えそうなテクニック系のものにしてみました。 題して「誰も教えてくれないExcel関数の便利な使い方（第1回）」 この記事はExcelの関数に多少は慣れている人が次のワンステップを踏み出せるようになることを目的としています。 その為、一つひとつの関数の使い方などの話は省かせていただきます。 予めご了承くださいませ。 すいません。いきなりVLOOKUP関数を全否定しました。 VLOOKUP関数はとても便利で使いやすい関数なのですが、いかんせんテンプレートとして使いにくいので個人的にはあまりおすすめしない関数でもあります。 どういうことか、簡単に説明します。 例えば、あなたは日々商品の値段を調査する必要があるとします。 取り扱っている商品の値段の一覧は、管理部門が日々マスタテーブルに入力していきます。 そして、VLOOKUP関数を使えば下図のよう
Google アドワーズのインタレストカテゴリの仕組みと設定、考え方までのスベテ｜アナグラム株式会社
「スベテシリーズ」の第六回目は、「Google アドワーズ、インタレストカテゴリの仕組みと設定、考え方までのスベテ」をお送りします。 インタレストカテゴリはユーザーの興味や関心に基づいてユーザーにリーチできる機能として、Googleアドワーズで 2009 年（メジャーリリースは2011年）から提供されています。また、現在に至るまで新機能の追加を含めアップグレードされ提供され続けてきた機能のひとつです。 インタレストカテゴリについてとその仕組みとは? これまでにも紹介してきたコンテンツターゲット やプレースメントターゲット は、ファッションのコンテンツを閲覧している関心のあるユーザーに、ファッションの広告を配信することが出来る機能、つまり、ユーザーが今見ているページの内容と関連して広告が掲載される機能でした。 しかし、ファッションに関心のあるユーザーが常にファッションに関するコンテンツを閲覧
ケーススタディ：若い女性向けのECショップにおけるデザイン
ECショップをデザインするとき、デザイナーはどういったことを気にしてデザインをするべきでしょうか。シンプルでおしゃれなビジュアル？ それともお得情報を前面に出しますか？ 実際の店舗でもさまざまなショップが存在するように、扱う商品やターゲット属性によって、当然ながらECショップのデザインアプローチも変わってきます。 今回はHamee株式会社で運営しているECショップにおける事例を、デザイナーの平山さんにお聞きしました。 平山 智也 氏 Hamee株式会社 デザイン部 UI/UXデザイナー 茨城県神栖市出身。大学では情報学部でデザインコースを選考し、WEBデザインやUI/UXを学ぶ。 学生時代のアルバイトで不動産広告のデザインやweb制作会社のインターン経験を経て、新卒でHameeに入社。現在はEC店舗のUI/UX改善、販促企画などのコンテンツデザインに携わっている。 同じ商品でもターゲットに
株式会社デモ - 御社の「最高」を目指して。
私たちはshopifyパートナーとして、オンラインショップの構築を得意としています！ shopifyなら安く、そして簡単にオンラインショップを開設することができます。
配色の参考！美しいCSSグラデーションカラーを集めたギャラリーサイトuiGradients
カラーリング、配色の参考にしたい美しいCSSグラデーションカラーをあつめたギャラリーサイトuiGradientsが、個人的にデザイン制作で役に立ったので、備忘録的エントリーとしてご紹介します。 画面いっぱいに表示されるスライダーから、お気に入りのグラデーションカラーを見つけたら、画面左下に表示されている「Get CSS Code」をクリック（Enterキーを叩くキーボード操作も可能）。CSSコードが表示されるので、「Copy to Clipboard」でコピー完了です。 デイ・トリッパー（Day Tripper）やモヒート（Mojito）、ジューシー・オレンジ（Juicy Orange）などネーミングも素敵ですよ。
浅葉克己デザイン室
Alternative content You need Flash Player 9 and allow javascript to see the content of this site.
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
市原湖畔美術館 | 日本デザインセンター
CoFuFun | 日本デザインセンター
Code to go
美しいグラデーションカラーをまとめている・「uiGradients」
