Package by Layer vs Package by Feature
Modularization is the process of decoupling a software system into multiple modules. In addition to reducing complexity, it increases the understandability, maintainability and reusability of the system. In this article, some of the modularization methods will be mentioned. Package by LayerIn this project structure, classes are placed in the architectural layer package they belong to. This method
【HTML/CSS】たかがフェードイン/フェードアウトするだけの挙動に全力で取り組んだ結果、最強のCSSができてしまった話【最強】
エウレカのPairsグローバル事業部エンジニアの山内です。 この記事は、eureka Advent Calendar 2017 13日目の記事です。 昨日は新卒エンジニア鈴木康文さんの「Goのフレームワーク“Revel”を触ってみた」でした。 これからGoをはじめてみようという方にはとても入っていきやすい内容です。是非。 # 前置き最近、HTML要素をフェードイン/フェードアウトする実装をしました。 たかがフェードインアウト、と侮るなかれ。 「CSSだけで表現」「JavaScriptは極力関与しない」「とにかく簡潔に」と決めて取り掛かるといくほどか難易度がアップします（しました）。 実装を終え、なるほどなぁと思うところがあったのでそのことを書くことにしました。 よろしければお付き合いください。 # 達成条件以下を満たす、フェードイン/フェードアウトを実装します。 アニメーションをスタートす
Announcing Flutter for Windows
Since we launched Flutter, we’ve focused on delivering a cross-platform solution for beautiful, tailored apps that are compiled to machine code and take full advantage of the underlying graphics hardware of your device. Today marks a significant expansion of this vision with the first production release of support for Windows as an app target, enabling Windows developers to benefit from the same p
Vue.js からみた AtomicDesign
この記事はVue.js #3 Advent Calendar 2017の13日目の記事です Atomic Design自体の記事は色々ありますので、この記事ではAtomicDesignで設計したコンポーネントをVue.jsで実際に運用してみて感じた事をまとめてみました 実際にどんな感じになるか結論から言うと、AtomとMoleculeにStoreを持たせず。 OrganismsとTemplateあたりの粒度でStoreを利用するとIA的にも収まりがいい様に思えます。是非デザイナーにツッコミ入れましょう。 VueコンポーネントをAtomicDesignで実装するとだいたいこんな感じになります。Atomの役割色・タイポ・ボタン固定文言など 直接描画要素にデータをレンダリング描画要素のイベントを発行親要素からのデータ受け取り登場箇所がすごく多いのでステートレスを徹底するStoreみちゃダメ絶対！
漫画で説明する Flux
Lin Clark 氏が “A cartoon guide to Flux” というタイトルでとてもわかりやすく Flux についての記事を投稿していました。この文章のなかでも書かれていますが Flux はとてもホットな話題です。しかし、まだまだ十分に理解されていない技術なので、著者の Lin Clark 氏に許可を頂いて翻訳させていただきました。何か間違いや分かりにくいところ、より良くするための助言などありましたら気軽に@sota0805 までコメントお願いします。 （以下、2015年9月29日に Lin Clark 氏によって書かれた “A cartoon guide to Flux” の翻訳です。） 漫画で説明する FluxFlux は現在のウェブ開発で最もよく理解されていない話題の１つです。このガイドでは誰もが理解できる方法で説明しようとしています。 問題はじめに Flux が解決
How to Set up Apache in macOS Sierra 10.12
Originally posted on DigitalShore.io on August 08, 2016 This guide currently reflects macOS Seirra 10.12.1Note: There have been several responses about 403 errors and access denied issues. Please be 100% certain to swap in your actual user name on your Mac, where ever there are instances of code using the placeholder of “username”. This step is highlighted several times throughout the guide and is
デザイナーの育成で大切にしたこと
ここ4年、育成に関わらせてもらって過ごしてきたのですが、久々に育成する人がいない4月を迎えるので、新卒デザイナーを育成する際に気をつけていたことを、この機会に振り返ってみようと思います。 自分のことはどうにかなってきた20代中盤、「デザイナー育ててね」と突然言われても何から始めればいいのかもよく分からないし、どうやってアドバイスしたらいいかも分からなかった当時、デザイナーの育成に関する記事があまりに少ない印象だったので、同じような境遇の人の役に立てば嬉しいです。 本人が課題を感じて初めて成長する突然ですが、他人に言われた時よりも自分で課題を認識できた方時の方が腹落ちしませんか？ どれだけ教える側（メンター）が一方的に課題感を感じていたとしても、一方通行では意味がなくて、逆に本人と課題感を共有できると、認識してるゴールが明確になるので、お互いに成長実感を得やすいです。 どうやって課題を共有す
イケイケなベンチャー企業が「リモートワーク」導入失敗する３つの理由
私はもともと富士通っていう会社で働いてたんですが、そこには中国にいても北海道にいても違和感なく会議ができる仕組みがありました。（少なくとも私が所属していた部署の現場には） 会議スペースが絶対的に足りないという理由からMicrosoft Lyncが導入されて、それ以来は社員同士が（たとえ向かい合って座っているとしても）Lyncでスクリーンシェアしながら電話会議をするというのが習慣化していたのです。 ところが、2015年にとあるベンチャー企業に転職して、それが当たり前じゃないことに気づきます。 「リモートワークやろう」と意識高く言う人はイケイケベンチャーだとたくさんいます。しかし、ちゃんとやることもやらないまま「うまくいかない・・・」と結論付けられるさまを何度か目の当たりにしました。 この記事では、「ちゃんとやることやってからじゃない？」と違和感を覚えたところをなんとなく書きのこしておきます。
優れたフォームをデザインする
サインアップのフローであれ、マルチビュー・ステッパーであれ、ありきたりのデータ入力であれ、「フォーム」はデジタル・プロダクト・デザインにおいて最も気を遣わなければならないものの1つです。 そこで、今回は一般的にフォーム・デザインで何をやり、何をやらざるべきかについてお話したいと思います。あくまで一般的なガイドラインですので、そのようなものとしてご理解頂いた上で、皆さんの参考になれば幸いです。
チームで仕事をすることについて
こんにちは、 Kaizen Platform, Inc. に入職して 1 年 3 ヶ月の Hitoshi Nakashima と申します。普段は福岡市で生活しており、遠隔にて就労しております。小社ではウェブアプリケーションエンジニアとして勤務しており、主に Ruby on Rails で構築されたウェブアプリケーションの開発・保守を行っています。最近では Kaizen Chat と呼ばれる Kaizen Platform ユーザー向けの Chat ソフトの開発に関与しました（小社製品をご利用の皆様でまだ Kaizen Chat をお試しいただいたことがないという方がおられましたら是非一度お試しください）。 個人では年に一度（主に年末）、失敗談や暗い話をブログに投稿してソーシャルネットワークの耳目を集めることを主な活動内容としております。 今日は最近のチームで仕事をすることについて話したいと
うわっ、私のサイトBootstrapくさすぎ!? たった数文字変えるだけでBootstrapのくさみが抜ける7つのCSSテクニック。
なんか、このサイトBootstrapくさい。そう感じることはありませんか? その理由はズバリ、欧文ベースでつくられたフレームワークを文字構造の違う日本語で適用した際に不都合が出てしまっているからです。 それらが醸し出す違和感を放っておくと、Bootstrapくささを生み出す大きな原因になってしまいます。 そもそもの問題として、欧文と比較して和文は文字の要素が多く、文字自体のリズムも少ないため、どうしても複雑で単調に見えてしまいます。 しかし、和文だからといってあきらめることはありません。BootstrapのCSSを少しだけ変えるだけでグッと見た目がよくなる隠し味をご紹介します。 1. line-heightで行間にゆとりを。明朝やゴシックなど、フォントの種類が言葉の印象を表すように、文字の行間は読みやすさ、文章全体の雰囲気を左右します。 欧文をベースに設計されたBootstrapをそのまま
組織が死にいたる病
今日、会社の事業部長と話していて、どうしても目の前の案件や問題解決を優先してしまって、気づいたら未来への打ち手が全く打てずに早半年・・・みたいな状況になりやすいよねー・・・！！という話をしていたので、自戒200%ぐらいで、組織が未来への… — 今日、会社の事業部長と話していて、どうしても目の前の案件や問題解決を優先してしまって、気づいたら未来への打ち手が全く打てずに早半年・・・みたいな状況になりやすいよねー・・・！！という話をしていたので、自戒200%ぐらいで、組織が未来への布石が打てなくなるフラグを考えてみた。 熱さと議論が煮詰まり死に至ったsaileチームの皆さんリーダーが忙しすぎる最も多くの情報を持ち、ビジョンを示す役割のリーダーが目の前のタスクに追われてしまい、「未来を考え、メンバーに示す」という本来の役割を全うできていないケース。忙しすぎる＝戦いを略せていない＝戦略がない＝頭を使
Slack を使い倒すための小技11選
ほとんどの人が Slack の機能の10%くらいしか使っていないの、知ってた？これから紹介する小技を使えば、Slack がうんと便利になるはずだよ。 1. 任意のやりとりへすばやく移動する Slack の“Quick Switcher”機能を使えば、見たいと思ったやりとり（チャンネルやDM）を簡単に開けるよ。呼び出すためのショートカットは ⌘+K だ（Windows なら Ctrl+K、Mac のデスクトップアプリなら代わりに ⌘+T も使えるよ）。“Quick Switcher”の入力欄はオートコンプリートが効くから、望みのチャンネル・DM・グループをパッパと切り替えられるようになってるんだ（切り替えが早すぎて :thumbsup: と入力する暇はなくなるけどね）。 おまけ： キーボードショートカットは他にもたくさん用意されてるよ。⌘+? （Windows なら Ctrl+?）で確認して
シリコンバレーのUXトレンド10選 / UX Survival Guidesレポート
先日、サンフランシスコで行われたUX Survival Guidesに行ってきました。10年以上シリコンバレーでUXデザイナーをしているJoe Prestonから最近のUXトレンド、プリンシパルに関するショートトークを聞くことが出来たので紹介します。(次回はプリンシパルについて書きます) https://www.youtube.com/watch?v=NEKvlVYR0SM&index=5&list=PLGkDzKLOoQkk2VaE_QDnE7h4FKlDbJF4Rミニマリゼーションとも呼びます。私たちがデザインを始めた90年代と比べて、非常に変化してきている流れの一つです。 背景、グラデーションや影、線、ラベル、、すべてのものを取り去ることが美しいデザインと考えられるようになっています。例えばグラフはこのようになります。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
npmの使い方について
Junior Designers vs. Senior Designers
Nyle Engineering Blog