import Moveable from "moveable"; const moveable = new Moveable(document.body, { target: document.querySelector(".target"), // If the container is null, the position is fixed. (default: parentElement(document.body)) container: document.body, draggable: true, resizable: true, scalable: true, rotatable: true, warpable: true, // Enabling pinchable lets you use events that // can be used in draggable,

スマホでボタンをどこに配置するとユーザーは操作がしやすいのか？ 上部と下部、水平に並べたボタン、垂直に並べたボタン、3つ以上のボタンなど、ボタン配置について包括的な分析を行い、ボタンをどのように配置するのが最適なのか解説した記事を紹介します。 The Optimal Placement for Mobile Call to Action Buttons by UX Movement 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに グーテンベルクの原則 上部と下部のボタン 水平に並んだボタン 垂直に並んだボタン 水平と垂直のハイブリッド スティッキーボタン まとめ はじめに ボタンをどこに配置するかによって、ユーザーがタスクを完了する時間に影響を与えることを知っていますか？ タスクを素早く完了することで、より満足のいくエ

この3行の説明のうち、「手を動かして何かを作る」というのは最後の1行のみしかない。つまり、デザインの全体のうち3分の2は手を動かして何かを作る前にやることがあるということ。これがデザインの本質だと鷹野氏は言う。 続けて、鷹野氏は自身が考えるデザインの定義を次のように説明した。 具体的な問題を解決するために情報などを【取捨選択して整理し、“スッキリ”させる作業】 具体的に「スッキリさせる作業」とは、以下の3つだ。 内容をスッキリさせる 何を盛り込む／盛り込まないべきなのか、内容を精査する 見た目をスッキリさせる スッキリした（余白が多めの）デザインがトレンド 気持ちをスッキリさせる 気持ちがスッキリしないと行動に結びつかない 初めての人と何度も経験している人では、抱えている課題が異なる。たとえば、初めての人であれば、スケジュール感、必要なもの、段取りなど、いろいろわからないことだらけだろう。

Sanil Chawla remembers the meetings he had with countless artists in college. Those creatives were looking for one thing: sustainable economic infrastructure that could help them scale rather than drown…

米マサチューセッツ工科大学（MIT）の研究チームは、初心者から専門家までそれぞれの用途にあったAIモデルを作成できる確率的プログラミング（PP：Probabilistic Programming）システム「Gen」を発表した。自動化、柔軟性、スピードといった特徴を併せ持ち、自動システム、ヒューマンマシンインタラクション（HMI）、拡張現実まで幅広く利用できる。研究結果は、2019年6月24日から26日に開催された「PLDI（Programming Language Design and Implementation conference）2019」にて発表された。 Genは、MITが以前開発した初期の確率的プログラミングシステム「Church」の概念をもとに、同じくMITで開発した汎用プログラミング言語「Julia」にいくつかのモデリング言語を取り入れて、さらに汎用性を高めたシステムだ。G

画像の遅延読み込みや無限スクロールを実装する際、ページ上に境界を定義し、その境界に要素が入ったかどうか判定して実行します。要素と境界の交差を非同期に検出し、パフォーマンスを改善する1Kbの軽量スクリプトを紹介します。 要素が境界に1px交差した、全部が入ったなどを正確に検出。他のJavaScriptへの依存はなく、単体で動作します。 Bounds.js -GitHub Bounds.jsの特徴 Bounds.jsのデモ Bounds.jsの使い方 Bounds.jsの特徴 画像の遅延読み込み、無限スクロールなどの実装には、境界を設定することが重要です。通常は、イベントハンドラ、ループ、getBoundingClientRectの呼び出しの組み合わせが必要でしたが、これらはメインスレッドで実行されるため、パフォーマンスが低下します。Bounds.jsは要素と境界の交差を非同期に検出し、パフォ

本当に多くのご意見ありがとうございます。文春オンラインで内容をまとめた記事を書かせてもらっております。Yahoo!にも転載されているようです。 ご参照ください。 以下、みなさまのコメントです。 id:muramurax 知人が○○ちゃんを救う会的な所の事務局を手伝った時に 絶対匿名を条件に1000万円寄付した方がいたそうです。 前澤さんもいろいろ派手な事をやっていますが 結局は宣伝なのかなと思っちゃいます。 71日前 Add Starmed2016med2016med2016 id:mental-management 自分の認識の甘さを痛感しました。勉強になりました。自分の周りにも伝えてみます。 71日前 Add Starmed2016med2016med2016 みか 先生、この事実を知らない人が多いから、、、知らなかったら前澤さんすごい！坂上さんごもっとも！と思ってしまいます。この事実

ウェブページのテキストはいくつかの文字サイズの組み合わせで出来ています。それぞれの文字サイズは情報の階層構造を表現するなどの役割を担いますが、同時にお互いが適切なバランスで調和しているべきです。そのため文字サイズはページやコンポーネントごとに場当たり的に決められるべきではありません。プロジェクトを通じて一貫したシステムを形成している必要があります。 そういった調和と一貫性を持った文字サイズのシステムを作るために、私たちのチームでは「調和数列」に基づいて一連の文字サイズを決めることがあります。調和数列とは等差数列（隣接する項が共通の差を持つ数列）の各項の逆数からなる数列です。 1, 2, 3, 4, 5, 6 ... // 等差数列 1, 1/2, 1/3, 1/4, 1/5, 1/6 ...　// 調和数列 実際に調和数列を用いて文字サイズを算出する例を以下に示します。 $font-siz

はじめに 当初、ScalaMatsuri 2019が終わった次の日の、6月30日に書く予定だったのですが、最終出社日も終わっていることだしよいかということで、エントリを書くことにします。 2019年6月30日をもって、5年と3か月勤めた株式会社ドワンゴを退職します。最終出社日は6月26日でした。 これまで2回転職してきましたが、ドワンゴに居た期間が最長です（なお、5年で最長でというのに違和感感じる人もいるかもですが、博士卒で就職したので、まあそんなもんかと思っています）。 何やってたの 1年目こそプロダクト開発に携わっていたものの、2年目以降は、 Scala研修テキストの執筆やメンテナンス 新入社員研修の中のScala研修講師 ドワンゴ社員として各種イベントやカンファレンスで発表 論文の査読や情報処理学会関連のイベント（主にPRO（プログラミング研究会））への参加 自分主催の勉強会（テーマ

改めて ソフトウェアアーキテクチャ GUI のアーキテクチャの歴史を調べてみたくなった。本来の MVC とは何か？何が正しくて何が間違っているか？も重要なのだが、それよりは、なぜそれが生まれたのか？何を解決しようとしたのか？どのような問題点が生まれて、それをどう工夫して解決・発展してきたのか？を知りたい。しかし、そういうことがまとまっている日本語の情報が少ないので、自分で色々かいつまんでメモしておく。 MVC の原点は 70 年代にまで遡り、実装としては Smalltalk-80 のクラスライブラリとして実装されたのが最初だと思われる。しかし、後世に大きな影響を及ぼしたポイントをいくつか持ちつつも、当時のアーキテクチャが現代においてそのまま利用されているケースはほぼないといっていい。したがって、単に MVC といった時には大抵最初期の MVC を指すことは少なく、区別するために最初期の M

ウェブページを表示するためのアプリケーションであるウェブブラウザは、今や多くの人が毎日のように利用する生活に欠かせないツールとなっています。そのブラウザがどのような仕組みで成り立っているのかについての解説がGitHubで公開されています。 GitHub - vasanthk/how-web-works: What happens behind the scenes when we type www.google.com in a browser? https://github.com/vasanthk/how-web-works この解説では例として「アドレスバーにgoogle.comと入力してからGoogleのホームページが表示されるまで」の流れが取り上げられています。 ・目次 ◆google.comの「g」を入力した時 ◆エンターキーを押した時 ◆URLを解読 ◆HSTSリストを確認

「氷河期世代」を「人生再設計世代」と言い直したように、 「非正規雇用」も聞こえが悪いから名前が変わるんじゃないかと予想。パソナとかの力で。 結果、「非正規雇用」という分類の人はいなくなる。 さて、「柔軟型雇用」とか「自由形雇用」だと 『柔軟、自由に雇用調整ができるっていう経営側の都合か！』とか世間に反発されそうだし、 どんな名前になるかな。 【追記】 ほぼ2週間でスピード達成の見込みが立った。 速やかな実現のためにも、ブクマカのアイデアが大臣に届くといいな。 "またも隠蔽か 根本大臣「非正規と言うな」と厚労省に指示" https://www.nikkan-gendai.com/articles/view/news/256521

おはようございます。 ホッテントリをご覧の皆さん、いかがどうでしたか？ Jinなどのゴミクソまとめ速報ブログで埋められてますね。 普段のスパムならすぐに排除されてるはずが、 排除されていませんね。 なぜでしょうか？ まとめと繋がってるから？運営の怠慢か？ その理由を明日まで考えといてください。 答えは明日教えます。 追記 皆さんも待つのは嫌でしょうから教えます。 ざっくり言うと、「運営が贔屓してるから」です。 こっからは読み飛ばしてもいいです。 実は私はとある事情で2年前から東南アジアの某国に住んでいて、 日本のプロキシに繋いではてなを見てます。それはさておき、 私にはささやかな楽しみがありました、 それは色々な個人サイトをブクマして宣伝してあげることでした。 しかし私が宣伝していた個人サイトは皆はてブから数時間のうちに「排除」されました。 なのにjinや速報系サイトやまとめブログは それ

概要 Dockerfileを書くためのベストプラクティスを読んで、ベストプラクティスなDockerfileを作った/作りたい人が対象です。 そのDockerfileで大丈夫かを3分でチェックできるツールをつくりました。Hadolintのような、単なるDockerfileのLinterではなく、ビルドしたイメージの中身まで細かく分析します。 通常のLinterでは原理的に不可能な、ベースイメージに存在している危険性も含めて調べることができます。 ←GitHubのStarもらえると嬉しいです。 Dockleの内部で使われているツールはTrivy, Vulsなどと同じなので、そのあたりを踏まえて、動作原理を別記事にまとめました。 人を震えさせるツール｢Dockle｣の仕組みを解説 なお、DockerHubで人気のコンテナに対して試した結果をサイトにして公開しています。操作方法もふくめて、別記事に

Robert Martin (a.k.a. ボブおじさん) による、 The Clean Architecture の翻訳です。似たようなアーキテクチャである ヘキサゴナルアーキテクチャ も翻訳したので参考にしてください。 この記事を翻訳して公開したことは 8th Light, Inc. に報告済みです。いまのところ苦情は来ていません。 ここ数年以上、システムのアーキテクチャに関する実にさまざまなアイデアを見てきた。これには、次のものが含まれる: Hexagonal Architecture (別名 Ports and Adapters) by Alistair Cockburn。Steve FreemanとNat Pryceが、Growing Object-Oriented Software というすばらしい本で採用した。 Onion Architecture by Jeffrey Pa

金髪の呂布♣♡🗻 @KinpatuNoRyofu 政府『GWは10連休にするやで』 ↓ 後輩『マジかぁ！海外旅行予約するンゴ』 ↓ ワイ『世間は休みだがクライアントの会社は動くかもだからみんな安易に飛行機とか予約するなよ～』 ↓ 後輩『よ、予約しちゃったンゴ』 ↓ ワイ『はあ？会社の予定確認しないで！？』 ↓ 翌週 後輩『会社やめます』←New!! 2019-01-15 14:27:51