マガジン
記事一覧
デザインエンジニアが考える、実装に歩み寄るFigmaを使ったWebデザイン
この記事はYUMEMI Design Advent Calendar 2022の14日目の記事になります。
お久しぶりです。今年の10月、株式会社ゆめみでデザインエンジニアチームが立ち上がり、チーム移籍をしました。デザインエンジニアの玉子豆腐です。
詳しい経緯・デザインエンジニアについては以下の記事をご覧ください。
フロントエンド歴が長いので、デザイン面で貢献できる事は何か考えたときに思いつい
Figmaで作字してみた
Figmaで文字のアウトライン化を使わずに作字するのにも慣れてきたので、備忘録も兼ねて過程を書き残しておこうと思う。
1.文字を決めるまずは文字を決める。好きな言葉や本のタイトル、好きな曲、適当に作った言葉などなんでもいい。今回は某曲の「蓮の台を分つ」という歌詞から辿り着いた、運命を共にするという意味の「一蓮托生」にした。
Figmaで適当なフレーム(自分はいつもインスタのサイズ)を作ったら、
HTMLとCSSで！和柄作成のすゝめ〜七宝編〜
某鬼滅の刃でもおなじみの和柄。多分HTMLとCSSを使って描く日は待ってても永遠に来ないので、自主的に描いてみることにした。
一応何パターンか描く予定だが、市松模様は簡単すぎるので多分描かない。ごめん炭治郎……。
今回は円満・調和・ご縁の意味が込められてる七宝を描いてみたので描き方をまとめる。某ラップバトルのシブヤ代表チームのマークのモチーフにもなっているあのマークだ。
これ↓
線のみの描
GithubのWikiに画像を貼るとき用のメモ
先日、GithubのWikiに画像を添付する機会があったがちょっと手間取ったのでまとめ。
1.リポジトリをクローンするWikiの右下にClone this wiki locallyと書かれている部分があるのでその下のURLを使ってWikiのリポジトリをクローン。
Git: remote: The `********' organization has enabled or enforced S
特殊加工の視覚サンプルを作ってみた
さて突然だがみなさん、特殊加工は好きだろうか？
ここで言う特殊加工とは特殊印刷のことで、例としてはエンボス、UV印刷、箔押しなど……もしかしたら聞いたことがない人もいるかもしれない。そもそも、使ったことがある方が稀だろう。
と、いうことで今回は特殊加工の魅力を伝えるべく、筆を取った次第である。
特殊加工の種類特殊加工には様々な種類がある。が、今回はエンボス加工・デボス加工・UV厚盛り・箔押しに
最後のメタラーニング研修を受けました
初回の研修から約2ヶ月。本日も株式会社ココスペースの方の研修をリモートで受けた。最後の研修ということで今までの振り返りと今回の研修のまとめを行いたい。
そもそもどんな研修を行ってきたのかは、1回目と2回目の記事に書いてあるので参考にして欲しい。
2回目の研修から今日までやってきたこと全員でミッションをクリアするために、それぞれ得意不得意を出し合った。例えば音声を聞いてアウトプットするのが苦手だ
とある新入社員の日記
株式会社ゆめみに入社して早2ヶ月半。仕事にも少しずつ関わるようになってきたこのタイミングで、研修の項目の一つにある「入社エントリーを書く」に挑戦しようと思う。
入社前のイメージゆめみと初めて出会ったのは逆求人イベントだったのだが、とにかく意味がわからなかった。イベントには個性的な会社ばかり揃っていたが、ゆめみは特に異質だった。給与自己決定？有給取り放題？すごろくで賞与を決める会社は聞いたことがあ
2回目のメタラーニング研修を受けました
前回の研修から約1ヶ月。本日も株式会社ココスペースの方の研修をリモートで受けた。研修開始から約半分と言うことで、主に進捗と今回の研修内容をまとめようと思う。
そもそも研修でどんなことをしてきたのか大体のことは1回目の記事に書いているが、この1ヶ月間何をやっていたのか少し説明しておこう。
日々の研修でやることといえば、その日にクリアしたミッションのポイントを集計し、スプレッドシートに日報とポイント
CSSで絵を描いてみよう〜さくらんぼ編〜
先日、CSSの限界が知りたくて調べていたら、とあるサイトにたどり着いた。
これらの作品は全てHTMLとCSSだけで書かれている。しかもHTMLはほぼdiv要素とclassの定義だけなので、実質CSSだけで書かれている。すごい。職人技である。
と、いうことで私も職人を目指すべく、CSSで絵を描いてみた。
用意するもの・描きたいものの写真(今回はさくらんぼなので美味しそうなやつ)
・CSSで絵を
CSSアニメーションを使ってまばたきをさせてみる
前回のおまけみたいなもの。CSSアニメーションもいろいろ触ってみたかったので、まばたきするアニメーションを作ってみた。
準備するもの元の画像と動かしたいもの。動かしたいものは透過pngにしておく。
元の画像↓
今回動かしたいのは目の部分なので、目を開けた状態と閉じた状態の透過画像を用意した。
この時、画像サイズを揃えておくと楽に重ねることができる。
CSSアニメーションを使ってみようまず
CSSブレンドモードとSVGで創作っ子に似合う髪色を探してみよう
先日、研修でsvgを初めて使った。アニメーション、画像自体の色を変えるなど様々な使い方がある。先輩や同期がすごいアニメーションを作っていたこともあり、とても興味を持った。簡単なアニメーションから勉強してみようかとも考えたが、svgのことを調べていると商品の色を動的に変えられる記事を見つけた。キャラクターの創作にも使えるかもしれないと思い、そちらに先に手をつけてみることにした。
イラストを描いてい
1回目のメタラーニング研修を受けました
本日、株式会社ココスペースの方にお越しいただき、リモートでメタラーニング研修というものを受けた。一応今日から約2ヶ月に渡って行われるらしい。最初という事で頭の整理も兼ねつつ、忘れないうちに感想を書き留めておこうと思う。
そもそもメタラーニングとは何か？これは機械学習特有の用語で、学習経験や結果から学習効率を上げる手法だ。つまりざっくり言うと、学び方を学ぶことといえる。(自分自身もあまり理解できて
入社4日目で心が折れそうになった話
※最初に、主観ではありますが入社したところがやばいところではないことと、ブラック企業でもないことだけは明記しておきます。会社の業務とはあまり関係のない話です。
一昨日、社会人になって初めての土曜日を迎えた。雑事はあったが、特にいつもと変わらない土曜日だった。スーパーで食料を買い、ゲームに課金し、イベントを走る。アニメやyoutubeを見ながら絵を描く。お腹が空いたら簡単なものを作って食べる。そこ