旅するように生きることを目標にしているWebデザイナー＆フロントエンドエンジニア。Web界隈のことやライフハックを発信中。
大阪→東京→湘南
ポートフォリオサイトはこちら
http://mako.red
ライフハック
去年、習慣を大きく変えるためにブログを書くことを掲げました。 そして確認することができた。 ”アウトプットを前提としたインプットは質が上がる”ということをお伝えします。 当初、デザイン向けのブログを書く気はなかった 20 …
キャリア
制作会社一筋だった僕も縁があって、今インハウスデザイナーとして働いています。 制作会社とは違う悩みがあったり、楽しさがあったりします。 インハウスデザイナーの楽しみや苦しみを共感してくれる人読んでって！！！ インハウスで …
デザイン
新しいUI/UX体験をさせてくれるサイトを紹介します。 ここ近年、WebデザインでCSSを使って3D表現ができるようになってきています。 スクロールしたらナナメから奥行きを持って出てくる そんなサイトを紹介します。 BL …
制作進行
僕は今とあるメーカーの中でWebデザイナー・エンジニアとして働いています。 デザインやブランディングがうまくて、自社商品がヒットしたという経緯もあり、メーカーではありながら僕が所属するデザインチームの社内での地位は高いで …
コーディング
テキストにとてもインパクトを与えることができるJavascriptを発見しました。 その名もBlotter.jsです。 読み込んでテキスト打ち替えておしまい。超簡単。 Blotter.jsをダウンロード 公式サイトはこち …
デザイン
インタラクションの参考はWebでは限界があるのでVimeoを見るようにしています。 2018年に入ってから気になったモーションを紹介します。Webに使える幾何学モチーフの作品が多数です。 Web制作でもインタラクションの …
デザイン
国内外の動画を魅力的に見せるサイトを集めました。 動画は必ずしもメインビジュアルにだけ使われるものではなく、UXを効果的に見せる手法としても使われます。 どこでどのように使われているかに注目して見て見ましょう。 前半は海 …
マーケティング
逃げちゃダメだ逃げちゃダメだ逃げちゃダメだ。 デザイナーはマーケティングで使用される数字や、KPIを設定するとなるとアレルギー反応がおきる。 ってことで、マーケティング用語のややこしい省略英単語をまとめました。 SNSが …
デザイン
これはまた派手なアニメーションを付けたなーって思う、デザインでのトータルブランディングの老舗、BEES&HONEYさんが新作だしました！ 毎回コーポレートサイト案件リニューアルの参考にさせてもらっています。 E …
デザイン
Webっぽいけどプロダクトっぽい。 そんな制作会社のポートフォリオを見つけました。 http://presnt.jp/ presnt http://presnt.jp/about 淡いブルーが爽やかなコーポレートサイトで …
ライフハック
僕はクリエイティブなモノづくりとされているWeb業界に長くいます。 そして世の中のモノづくりに携わる人たちに知ってほしいことがあります。 モノづくりは最高に楽しいけど、心身ともに健康だからこそ楽しいのだと。 僕はデザイナ …
コーディング
とっても便利なススクロール系Jsを発見しました。 しかもMITライセンスときたら、使わせてもらうしかない。 では手を合わせて。いただきます。 SCROLL MANAGER とりあえず見てもらえるとわかります。 アニメーシ …
海外エンジニアリング
僕は去年、日本とフィリピンを繋ぐブリッジエンジニアとして現地で働いていました。 ブリッジエンジニアとは、日本の制作案件をフィリピンの支社で行うために、現地のエンジニアに説明や指示を出す役割です。 もちろん僕はフィリピンの …
キャリア
あけましておめでとうございます。 いつも読んでくれてありがとうございます。 今年もよろしくお願いします。 今日は奥さんの実家の埼玉で、スマホを使って書いています。さすがデジタルノマド笑 それでは、デジタノルマド挑戦記アル …
ライフハック
年の瀬なのでブログのAnalyticsのデータを眺めながら振り返り。 2017年1月1日から12月29日までにarutegaでよく読まれた記事のトップ10をまとめておきます。 1位：参考にしたい日本人デザイナー・エンジニ …
コーディング
かなり強気なタイトルですが実際に最近の案件でSwiperというjavascriptのプラグインを使っております。 もう現場ではSwiper.js以外のJsは必要ないと思います。 Swiper.jsの特徴 Swiperの特 …
デザイン
アディダスのサイトはいつもかっこいいですね。 スニーカーのブランドで一番好きなんはReebokなんやけど、サイトでゆーたらアディダスが一番かっこいい。 このサイトを制作したResnという制作会社はとっても有名。 ニュージ …
制作お役立ち
今年前半はとても開発に力を注いだ。そして後半は複業に力を注いだ。 にしても本当によく働いた年でした。 そこで今年、僕がWebサイト制作のチーム開発をやる上で使っていたツールを紹介します。 エディターソフトの好みはエンジニ …
ライフハック
少しでも生活を豊かにしようと、無駄遣いせずにQOL（生活豊か度）をあげたい。 それほどお金がなくても生活を豊かにしようと、毎日試行錯誤を重ねています。 それはそれでたのしいですね。 年の瀬なんで2017年に買ってよかった …
Wordpress
表題の通り、固定ページに投稿の一覧を取得するテンプレートタグは、 使用頻度が高いのに思い出せないので僕のための備忘録です。 テンプレートタグ：固定ページに投稿記事一覧を表示する 使い道：固定ページを作った際に、archi …
デザイン
無名だった制作会社がいきなりCSSDAとAWWWRDSをかっさらいました！ ずっと紹介したかった。 立体感とシズル感がすごいサイトがやってきました。 SUPERCROWDS 制作会社：SUPERCROWDS 制作：SU …
キャリア
エンジニアやデザイナーになった理由の一つに 「コミュニケーションが苦手だから黙々とパソコン相手に作業をしていたい。」 などという、コミュ障はたくさんいます。 この職種でコミュニケーションが上手 or 好きっていう人は多く …
マーケティング
2017年も残りわずか。来年の目標を立てる時期ですね。 今年もGoogleは適切な検索結果を表示するためにたくさんの施作を行いました。 SEOというワードそのものは、割とポピュラーになっているのではないかな。 Googl …
マーケティング
2017年12月6日水曜日、グーグル公式ブログから医療や健康に関連する検索結果の改善について、日本語検索アップデートに関する記事が公表されました。 今回は少し前に問題になっていた、DeNAのWELQ、ヘルスケア大学がたた …
デザイン
今年もあとわずかになってきました。そろそろ今年つくった記事をまとめはじめています。 今年もいろんな制作会社のポートフォリオサイトのリニューアルがありました。 そこで僕が一番衝撃を受けたコーポレートサイトのリニューアルを紹 …
コーディング
やっとムスリム向け日本食レストラン”HALAL SAKURA”様のWebサイトを公開しました。 いやー感無量ですね！東京のクライアントを相手に大阪から初めてフルリモートで全ての工程を終えることができました。 おめでとうご …
コーディング
wow.jsを使うととても簡単にスクロールアクションを設定できます。 スクロールを着火させるためにwow.jsでトリガーを設定→animate.cssを使ってアニメーションを設定。 この方程式は2年くらい使い続けています …
コーディング
僕が使い慣れている、一番簡単なパララックスのjqueryのプラグインを紹介します。 パララックスを使う理由 写真素材をもらってからの制作依頼はとても多いでしょう。 だから、できるだけ写真素材がいろんな角度から見えるように …
コーディング
スクロールのスピードはjaueryを使って調整することができます。リッチに見せるための表現技法としては古くからありますね。 スクロールのスピードを調整すると文章をじっくり読ませることができます。 コピペして使えるjque …
デザイン
Webデザインに舌鼓をうつvol.4はトレンドを全部押さえたサイトを紹介します。 このBOTANISTというシャンプーは、あなたもドラッグストアで一度は見たことがあるのではないでしょうか？ 今やどこにでも売ってるバスブラ …
