りょーた ❖ design engineer

フロントエンドエンジニア兼デザイナー@株式会社ニュートラル ペンギンのイラスト描いてま…

りょーた ❖ design engineer

フロントエンドエンジニア兼デザイナー@株式会社ニュートラル ペンギンのイラスト描いてます（instagram.com/ryotanny/）
  • 商品の画像

    スマホとペンギンの壁紙（スマートフォン用）

    【ダウンロード販売】「飛ばないペンギン」という名前でペンギンのイラストを描いています。 じーっとスマホを見てるペンギンの壁紙を作りました！ スマートフォンにご利用いただけます。
    300円
    飛ばないペンギン
  • 商品の画像

    スマホとペンギンの壁紙（デスクトップ用）

    【ダウンロード販売】「飛ばないペンギン」という名前でペンギンのイラストを描いています。 じーっとスマホを見てるペンギンの壁紙を作りました！ デスクトップにご利用いただけます。
    300円
    飛ばないペンギン
  • 商品の画像

    新生活ワクワクのペンギンの壁紙（デスクトップ用）

    【ダウンロード販売】「飛ばないペンギン」という名前でペンギンのイラストを描いています。 春の新生活らしいペンギンの壁紙を作りました！ デスクトップにご利用いただけます。 ぜひ、あなたのPCで新生活を迎えましょう！！
    300円
    飛ばないペンギン
ストアを見る
  • 商品の画像

    スマホとペンギンの壁紙（スマートフォン用）

    【ダウンロード販売】「飛ばないペンギン」という名前でペンギンのイラストを描いています。 じーっとスマホを見てるペンギンの壁紙を作りました！ スマートフォンにご利用いただけます。
    300円
    飛ばないペンギン
  • 商品の画像

    スマホとペンギンの壁紙（デスクトップ用）

    【ダウンロード販売】「飛ばないペンギン」という名前でペンギンのイラストを描いています。 じーっとスマホを見てるペンギンの壁紙を作りました！ デスクトップにご利用いただけます。
    300円
    飛ばないペンギン
  • 商品の画像

    新生活ワクワクのペンギンの壁紙（デスクトップ用）

    【ダウンロード販売】「飛ばないペンギン」という名前でペンギンのイラストを描いています。 春の新生活らしいペンギンの壁紙を作りました！ デスクトップにご利用いただけます。 ぜひ、あなたのPCで新生活を迎えましょう！！
    300円
    飛ばないペンギン
  • もっとみる
  • 固定された記事

【誰でもできる】Figmaで画面遷移図をautoflowなしに作るテクニック

デザインエンジニアのりょーたです。 突然ですが、皆さんは画面遷移を表す際に、どうしていますか？ よくデザイナーさんに聞くと「Autoflow」を使うといいよ！と教えてくれます。（関係ないけどOGPがアニメーションなってるのすご） 私はWebデザインで画面遷移を示す際に使っていましたが、使っていて不便だと思う点がいくつかありました。 例えば Autoflowの不便な点①：プラグインを起動していないと矢印が追従してくれない Autoflowの不便な点②：テキストが操作し

りょーた ❖ desi…

    • つながる勉強会を終えて

      タイトルにもあるように、2021年1月より計21回にわたって開催したつながる勉強会を、2023年9月で終了しました。勉強会に参加いただいた皆様、本当にありがとうございました！ また、これまで運営に関わってくださった、ゆーたろーさん、ユウトさん、uたそさん、ジョイさん、なるおさん、本当にありがとうございました🙇‍♂️ 立ち上げ期から最後まで運営に携わっていたので、本記事では 勉強会の運営に至った経緯 勉強会を開催して良かった点 勉強会を終了した理由 コミュニティ運営か

      りょーた ❖ desi…

      • デザインとエンジニアリングの両立の価値

        デザイン≧エンジニアリングになってきたりょーたです。 株式会社ニュートラルでMusubiteのデザインとフロントエンド領域の責任者をしているほか、副業でデザイナーとしてネイティブアプリのデザインを行なっています。 最近気づきがあったので、忘れないうちに書いておこうかと思います。 ◎体験 非IT企業に就職した大学の友人と話す機会があり、「社内ツールを作る場合、〇〇の機能を作るのってエンジニア目線でたいへん？」という質問を受けた。 その際に、「作るのは難しくなさそうだけど

        りょーた ❖ desi…

        • キャリアのＪカーブ

          株式会社ニュートラルでCDOをしています、りょーたです。 最近Youtubeで動画を見て、これまでのキャリアについて良い気づきを得たので、入社して半年たった今、振り返りも兼ねて書き残したいと思います。 ↓ 視聴した動画はこちら 私のこれまでのキャリアを記載しておきます 守破離を意識する 動画を見て強く印象に残ったのは、「守破離」という言葉です。 「守破離」と言う考え方は初めて知ったのですが、今後のキャリアを考える上でとても良い指標になりますし、仕事を行う上で型として

          りょーた ❖ desi…
        • 固定された記事

        【誰でもできる】Figmaで画面遷移図をautoflowなしに作るテクニック

        りょーた ❖ design engineer

        人気の記事

        人気の記事をすべて見る すべて見る

        はじめまして、りょーたです👋

        つながる勉強会を終えて

        最適なOGP画像を作るためにFigmaでコンポーネントを作った

        [デザイナー＆エンジニア向け]無限スクロールとページネーションの比較

          最適なOGP画像を作るためにFigmaでコンポーネントを作った

          皆さんは自身のメディアやポートフォリオ、サービスはお持ちでしょうか？ お持ちの方の中には、OGP画像について以下のような悩みを持った方は少なくないはずです。 🫠「埋め込み先のメディアによってプレビューに表示されるOGP画像のアスペクト比がバラバラなのに、１枚しか用意できないのマジ困る…」 私もまさに、その中の一人でした。 弊社サービスのMusubiteのOGP画像を用意するにあたり、マストで表示させたい情報があったのですが、メディアによって情報が切れてしまうという事象があ

          りょーた ❖ desi…

          最適なOGP画像を作るためにFigmaでコンポーネントを作った

          りょーた ❖ design engineer

          ランチャーツールをRaycastに変えました

          早起きしたので気分良く記事を書いているりょーたです。 最近、生産性に関わるツールを置き換えたので、感想をつらつらと書いていきたいと思います。特に課題感は感じてないけど読んでやるか、という方がいましたら幸いです。 タイトルにもあるとおり、ランチャーツールをalfred（powerpack） → raycastに変えました。 余談ですが、AI機能も開発中とのことなので、かなり楽しみなところ👀 Raycastのよかったところ raycastを使い始めて２週間ほどなのですが

          りょーた ❖ desi…

          ランチャーツールをRaycastに変えました

          りょーた ❖ design engineer

          テキストにグラデーションのアニメーションを加える

          CSSが好きなりょーたです。 今回は、ポートフォリオで実装しているテキストのグラデーションを使ったアニメーションの実装方法を紹介します。 実際の成果物は以下をご覧ください。 これを見て既視感を感じた方はおそらくAmazon Prime Videoを使っている方でしょうか？？笑 本家はおそらくアニメーションを作って埋め込んでいるのだと思うのですが、今回は、HTMLとCSSでやってみました。 アニメーションの色やスピードは自由に設定できますので、ご自由にお試しくださいね！😜

          りょーた ❖ desi…

          テキストにグラデーションのアニメーションを加える

          りょーた ❖ design engineer

          ChatGPTにGraphQLの学習ロードマップを相談してみた

          と、noteのAIアシスタント(β)に書き出しを考えてもらった、りょーたです。 これまで「GraphQLの勉強を始めよう」とn度目かの思い立ちをしたのですが、毎回忘れてしまう癖がついていたので、今回はChatGPT先生に学習の進め方を聞いてみたところ、かなり参考になる話ができたので、記録として残したいと思います。 1. 自分の状況を伝える改行しようと思ってEnterを間違えて押して、途中でプロンプトが終わってしまったのですが、先生は意図を汲んで、 GraphQLを学習す

          りょーた ❖ desi…

          ChatGPTにGraphQLの学習ロードマップを相談してみた

          りょーた ❖ design engineer

          【Portfolio】RSSで取得した記事データを表示する

          こんにちは、今年もお花見をしていないりょーたです。 まだ夜は寒いですね🥶 今回は、自分のポートフォリオに、RSS経由で取得した note Qiita Zenn の記事リンクの一覧を表示するようにしたので、そちらについてまとめたいと思います。 ↓実際のページはこちら やりたかったこと私は普段、先ほどあげた３つのメディアで記事（ブログ）をあげているのですが、折角なのでこの情報をポートフォリオ内で集約して表示したいと考えました。 CMSを用いて、記事を作成するたびに

          りょーた ❖ desi…

          【Portfolio】RSSで取得した記事データを表示する

          りょーた ❖ design engineer

          【Musubite】トークテーマの改善を行いました

          こんにちは、りょーたです。 株式会社ニュートラルでデザインエンジニアをしています。 今回は、弊社のプロダクトMusubiteのUI改善と、それに伴うUX向上についてのお話第3弾です。 １つ目の記事はこちら 👉「ドロップダウンのUX改善を行いました」 https://note.com/ryotanny/n/n8fbe24230ae7 ２つ目の記事はこちら 👉「チャットのUX改善を行いました💬」 https://note.com/ryotanny/n/n95b164ba38

          りょーた ❖ desi…

          【Musubite】トークテーマの改善を行いました

          りょーた ❖ design engineer

          【Musubite】チャットのUX改善を行いました💬

          暖かくなってアウターを変えたら夜が意外と寒くて震えがちなりょーたです。 株式会社ニュートラルでデザインエンジニアをしています。 今回は、弊社のプロダクトMusubiteのUI改善と、それに伴うUX向上についてのお話第2弾です。 １つ目の記事はこちら 👉「ドロップダウンのUX改善を行いました」 改善箇所今回改善した箇所は、企業の中のエンジニアとのチャット画面です。 Musubiteにおけるチャットは、もちろん雑談としての利用もあるかと思いますが、 初めましてのアイスブレ

          りょーた ❖ desi…

          【Musubite】チャットのUX改善を行いました💬

          りょーた ❖ design engineer

          【Musubite】ドロップダウンのUX改善を行いました

          暖かくなって嬉しい反面、花粉が辛くなってきましたね🤧 株式会社ニュートラルでデザインエンジニアをしています。 今回は、弊社のプロダクトMusubiteのUI改善と、それに伴うUX向上についてのお話をします。 改善箇所今回修正したのは、検索フォームや、ユーザー情報の入力フォームのドロップダウンです。 修正前は、ユーザーの入力値によってフィルターされた候補を選ぼうとすると、クリック（タップ）するアクションが必要でした。 もし、そのアクションを行わなかった場合、その入力内容は

          りょーた ❖ desi…

          【Musubite】ドロップダウンのUX改善を行いました

          りょーた ❖ design engineer

          MVPリリースに向けて２ヶ月間取り組んだ内容の振り返り

          こんにちは。2023年1月より株式会社ニュートラルでデザインエンジニアをしております、りょーたです。 この度、Musubite（読み方：むすびて）というサービスをMVPでリリースしました👏👏👏 一旦の区切りとして、ジョインしてからの約２ヶ月を振り返りをしたいと思います。 役割私は1人目デザイナー＆1人目フロントエンドエンジニアとして、以下を担当していました。 モックやグラフィックの作成 フロントエンド開発全般 前職はSIerでフロントエンドエンジニアをしており、フロ

          りょーた ❖ desi…

          MVPリリースに向けて２ヶ月間取り組んだ内容の振り返り

          りょーた ❖ design engineer

          [デザイナー＆エンジニア向け]無限スクロールとページネーションの比較

          株式会社ニュートラルでデザインエンジニアをしているりょーたです。 みなさん（デザイナーさんとエンジニアさん）は、無限スクロールとページネーションをどう使い分けているでしょうか？ 私は前職で約３年間フロントエンドエンジニアだったのですが くらいに思っていました。ただ、現職でデザインも担当することになり、「ページネーションと無限スクロールはどの基準でデザイナーは選んでるんだ？」と気になり調べてみました。 この記事は、前半部分は主にデザイン領域の話をして、後半部分でエンジニア

          りょーた ❖ desi…

          [デザイナー＆エンジニア向け]無限スクロールとページネーションの比較

          りょーた ❖ design engineer

          noteの「#このデザインが好き」

          12月22日からnoteを使い始めてるんですが、使っている中で、いいなと思うUIや参考にしたい設計がたくさんあったので、備忘も兼ねてまとめていきたいと思います。 今回紹介したいと思ったのは、スマホのブラウザで見た記事閲覧ページです👇 僕がどこに感動したか分かりましたか？？？笑 👇👇👇👇 そう、ヘッダーです！！ よく見てみると、下スクロール時と上スクロール時で別のUIが表示されるようになっているんですよね👀 下方向へのスクロール時は、記事の執筆者の情報とフォローしてい

          りょーた ❖ desi…

          noteの「#このデザインが好き」

          りょーた ❖ design engineer

          2022→2023

          りょーたです。自己紹介をこちらで書いているので、もし興味を持っていただきましたら読んでいただけると幸いです😆 ズボラなので、2022年の振り返りと2023年の目標をまとめて書きます。 2022年の振り返りカジュアル面談した 今年はエンジニアになって3年目の年だったのですが、自分が本業で何をしていきたいか（軸をどうしていくか）を真面目に考えた年でした。 答えを出すために具体的にしたことは、カジュアル面談です。前々から、フロントエンドエンジニアとデザイナーの両立をしていきた

          りょーた ❖ desi…

          2022→2023

          りょーた ❖ design engineer