MENU

Home
My Blog
Community

rislabo Web Design Blog

Home
My Blog
Community

ホーム
My Blog

My Blog

Illustrator

色だけじゃない！スポイトツールの便利な使い方

2024年10月16日
その他

魅力的なバナーに！配色のコツと色の使い方

2024年10月15日
Photoshop

初心者でも簡単！Photoshopの2倍書き出し完全ガイド

2024年10月5日
HTML&CSS

CSSでも動きが付けられる!?CSSアニメーションについて

2024年10月5日
環境構築

File Zillaについて初心者向けに徹底解説！

2024年10月4日
環境構築

Webサイトの公開手順について徹底解説！

2024年10月3日

1...2 345 6...28

Figma

インストールしたフォントをFigmaで使うための完全ガイド

2024年7月31日
Photoshop

初心者でも簡単！Photoshopの2倍書き出し完全ガイド

2024年10月5日
Figma

Figmaのデータ共有について徹底解説！

2024年5月22日
Photoshop

Photoshop「整列」「均等配置」を使いこなす方法

2024年11月24日
フリーランス

ギガファイル便を使いこなそう！初心者向けのわかりやすい解説

2024年8月21日
Illustrator

Illustrator 便利な「スクリプト」の入れ方

2024年9月3日

検索

関口愛里

株式会社iris代表取締役

■Web制作会社を経営
■女性の自立をサポートするWebデザインスクール運営
■現在140名超えの女性限定のWebデザインチームを運営
■Webデザイナーを目指したい方に向けてWebデザイナーになるために必要な勉強方法〜現場のリアルを発信していきます。

カテゴリ一覧

デザイン (106)
フリーランス (9)
プログラミング (55)
未分類 (6)

タグ一覧

adobe Figma Google Chrome HTML&CSS Illustrator JavaScript Photoshop Sass VS Code Webデザイナー Webデザイン Web制作 WordPress コーディングデザイン基礎バナーフォントフリーランスフリー素材ポートフォリオ制作実績

instagram

aichan_webdesign

誰でも分かるWebデザインの知識をInstagramでも毎日配信中↓ デザイン、コーディング、Webデザイナーに必要な知識etc

💡 これ知ってる？爆速でできる小技

💡 これ知ってる？爆速でできる小技集
をIllustratorで作成しよう！
⁡
①＜その１＞一瞬で別のオブジェクトに変える小技
② 一瞬で別のオブジェクトに変える方法
③＜その2＞離れたパスを一瞬でつなげる小技
④ 離れたパスを一瞬でつなげる方法
⑤＜その3＞「角」の形状を一瞬で変える小技
⑥ 「角」の形状を一瞬で変更する方法
⑦まとめ
⁡
この投稿を保存して、何度も見返せるようにしてね✨
⁡
——————————————————————
・無料の女性限定コミュニティ「リスコミュ」を運営中
・Webデザインスクール「リスラボ」では自立するママを育成中！
・株式会社iris（Web制作会社）代表取締役
・初心者向けに超有益なWebデザインブログ（デザイン〜コーディング、WordPress化）を運営中
⁡
詳しくはプロフィールをチェックしてね！
@aichan_webdesign
⁡
#Adobe
#AdobeIllustrator
#Illustrator
#webデザイン
#webデザイナー

💡 超便利！一番簡単な削除&生成法
をPhotoshopで作成しよう！
⁡
①不要な被写体を削除する方法
②なげなわツールで不要なものを囲う
③｢生成塗りつぶし｣を選択→空白のまま生成
④不要な被写体の削除が完了
⑤被写体を別の物に置き換える方法
⑥プロンプトを入力し生成する
⑦別の物への置き換え完了
⁡
この投稿を保存して、何度も見返せるようにしてね✨
⁡
——————————————————————
・無料の女性限定コミュニティ「リスコミュ」を運営中
・Webデザインスクール「リスラボ」では自立するママを育成中！
・株式会社iris（Web制作会社）代表取締役
・初心者向けに超有益なWebデザインブログ（デザイン〜コーディング、WordPress化）を運営中
⁡
詳しくはプロフィールをチェックしてね！
@aichan_webdesign
⁡
#Adobe
#AdobePhotoshop
#Photoshop
#webデザイン
#webデザイナー

@aichan_webdesign ←躍動感がすごい、動きのある画像の作り方知ってる？

今日のリールは
「躍動感がすごい！動きのある画像の作り方」について
解説してみたよ！

①編集する画像を用意する
②被写体を選択して選択範囲を複製
③パスぼかしで残像を作成
④グラデーションで好みのカラーを設定
⑤クリッピングマスクをかける
⑥描画モードを「オーバーレイ」に設定
⑦躍動感がすごい、動きのある画像の完成

パスの向きや速度を変えるだけで
ぼかしのかかり方がかわるから
色々試してみてね✨
⁡
⁡
⁡
-—————————————
AIRI SEKIGUCHI
⁡
お役立ち情報を発信するので
フォローしてね♡
" @aichan_webdesign "
⁡
⁡
ーやってることー
■現在270名を超える無料女性限定コミュニティ
（リスコミュ）を運営中
・女性限定の駆け出しデザイナーからベテランデザイナーの方までいます。
・勉強会や懇親会を月1.2回で開いてます
・興味ある方はお気軽に参加してね♡
→参加条件は最初にzoomで顔合わせ出来る方、女性、頑張りたい方、輪を乱さない方
⁡
⁡
参加方法は
①プロフィールに移動
②プロフィールのURL（LINE公式）をタップ
⁡
↓ ↓ ↓
ライン公式から友達追加して
『リスコミュ』と送ってね✨
⁡
もしくはInstagramのDMに
『リスコミュ』とメッセージしてね☺️
⁡
⁡
■ iris mama creative labo
リスラボ運営・代表
デザイン〜コーディングまで一貫して出来る強者ママを育成
⁡
⁡
■株式会社iris（Web制作会社）代表取締役
<サービス内容>
・ホームページ、LP制作
（デザイン〜コーディング）、Webサイト全般、システム開発
・印刷物（名刺、チラシ、パンフレット、
メニュー、ポスター等）
・映像編集
⁡
お問い合わせはDMからお願いします📩
⁡
⁡
-—————————————
⁡
#webデザイン
#webデザイナー
#Adobe
#AdobePhotoshop
#Photoshop

💡とっても便利！編集できるマーカーの作り方
をIllustratorで作成しよう！
⁡
①テキストツールで文字を入力する
②｢パスファインダー｣→
　｢複合シェイプを作成｣を選択
③ ｢アピアランス｣で新規塗りを追加する
④ ｢形状に変換｣→｢長方形｣を選択
⑤「形状オプション｣で幅と高さを調整する
⑥ ｢パスの変形｣→｢変形｣で
　マーカーの位置を調整する
⑦編集できるマーカーの完成
⁡
この投稿を保存して、何度も見返せるようにしてね✨
⁡
——————————————————————
・無料の女性限定コミュニティ「リスコミュ」を運営中
・Webデザインスクール「リスラボ」では自立するママを育成中！
・株式会社iris（Web制作会社）代表取締役
・初心者向けに超有益なWebデザインブログ（デザイン〜コーディング、WordPress化）を運営中
⁡
詳しくはプロフィールをチェックしてね！
@aichan_webdesign
⁡
#Adobe
#AdobeIllustrator
#Illustrator
#webデザイン
#webデザイナー

💡 一瞬でできる！スプレー加工を自

💡 一瞬でできる！スプレー加工を自然に再現
をPhotoshopで作成しよう！
⁡
①加工したい画像を開き、
　新しいレイヤーを上に追加
②ブラシの色を白にして、クリックで点を描く
③ブラシで描いたレイヤーの不透明度を下げる
④｢編集｣→｢変形｣→｢遠近法｣を選択する
⑤左上の角をクリック→右方向に動かしねじる
⑥下の部分だけを長方形選択ツールで囲って削除
⑦噴射口に配置すれば、
　自然なスプレー加工の完成
⁡
この投稿を保存して、何度も見返せるようにしてね✨
⁡
——————————————————————
・無料の女性限定コミュニティ「リスコミュ」を運営中
・Webデザインスクール「リスラボ」では自立するママを育成中！
・株式会社iris（Web制作会社）代表取締役
・初心者向けに超有益なWebデザインブログ（デザイン〜コーディング、WordPress化）を運営中
⁡
詳しくはプロフィールをチェックしてね！
@aichan_webdesign
⁡
#Adobe
#AdobePhotoshop
#Photoshop
#webデザイン
#webデザイナー

【なっちゃん】とコメントすると対談動画が見れます✨️
⁡
@aichan_webdesign
⁡
————————————
⁡
今日はリスラボ1期性
なっちゃんの卒業後実績を紹介するよ！
⁡
【なっちゃんの実績】
・1児のシングルマザー
・コーダーとして活動
・irisのメインコーダーに抜擢

⁡
▪️Q&A

Q.リスラボに入る前は何をしていましたか？

A. 料理人の仕事をしながらフリーランスを目指してwebデザインを学んでいました。
 
Q.どんな事に悩んでいましたか？

A. 他のwebデザインスクールを卒業しましたが、自力で案件も取れず、実力不足を痛感していました。
 
Q.リスラボに入会しようと思った
きっかけはなんですか？

　A. 実力不足で悩んでいる時、愛ちゃんに出会い、愛ちゃん「ママだって輝ける」という言葉がとても刺さり、入会を決めました。
⁡
⁡
Q.リスラボに実際入ってみてどうでしたか？ 
⁡　A. webデザインのスキルだけでなく、マインドも大きく変わり、人生を変えるきっかけになりました！
⁡
————————————
⁡
なかなかうまくいかないあなた。
努力の方向性が間違ってないですか？
⁡
本気で頑張れば半年あれば人生は変わります。
⁡
1人で悩んでる方は遠慮なくDMで相談してください😌
⁡
————————————
・無料の女性限定コミュニティ「リスコミュ」を運営中
・Webデザインスクール「リスラボ」では自立するママを育成中！
・株式会社iris（Web制作会社）代表取締役
・初心者向けに超有益なWebデザインブログ（デザイン〜コーディング、WordPress化）を運営中
⁡
詳しくはプロフィールをチェックしてね！
@aichan_webdesign
⁡

#webデザイン
#webデザイナー
#ママWebデザイナー

💡超便利！画像からフォントを検索する方法
をIllustratorで作成しよう！
⁡
①調べたいフォントの画像を配置する
②「Retype」を選択する
③ 調べたい範囲を指定する
④ 「Retype」パネルで検索結果を確認する
⑤フォントが見つかったら
　｢クリックして追加」する
⑥画像からフォントの検索が完了
⁡
この投稿を保存して、何度も見返せるようにしてね✨
⁡
——————————————————————
・無料の女性限定コミュニティ「リスコミュ」を運営中
・Webデザインスクール「リスラボ」では自立するママを育成中！
・株式会社iris（Web制作会社）代表取締役
・初心者向けに超有益なWebデザインブログ（デザイン〜コーディング、WordPress化）を運営中
⁡
詳しくはプロフィールをチェックしてね！
@aichan_webdesign
⁡
#Adobe
#AdobeIllustrator
#Illustrator
#webデザイン
#webデザイナー

💡これは凄い！水のような文字の作り方
をPhotoshopで作成しよう！
⁡
①好きな背景や画像の上に文字を打ち込む
②描画モードを変更する
③ ｢ベベルとエンボス｣を適用する
④「光彩（内側）」を適用する
⑤「シャドウ(内側)｣を適用する
⑥ ｢ドロップシャドウ｣を適用する
⑦水のような質感の文字が完成
⁡
この投稿を保存して、何度も見返せるようにしてね✨
⁡
——————————————————————
・無料の女性限定コミュニティ「リスコミュ」を運営中
・Webデザインスクール「リスラボ」では自立するママを育成中！
・株式会社iris（Web制作会社）代表取締役
・初心者向けに超有益なWebデザインブログ（デザイン〜コーディング、WordPress化）を運営中
⁡
詳しくはプロフィールをチェックしてね！
@aichan_webdesign
⁡
#Adobe
#AdobePhotoshop
#Photoshop
#webデザイン
#webデザイナー

@aichan_webdesign ←違和感なくライトを明るくする方法知ってる？

今日のリールは
「違和感なくライトを明るくする方法」について
解説してみたよ！

①編集する画像を用意する
②新規レイヤーを追加して選択範囲を作成
③選択範囲を白で塗りつぶし、不透明度を下げる
④レイヤー効果の設定
⑤ぼかし（ガウス）をかける
⑥新規レイヤーを追加してブラシツールで光を足す
⑦④と同様にレイヤー効果の設定
⑧自然にライトをつけた画像の完成

描画モードをオーバーレイにするだけで
⁡自然な光をつけることができるから
⁡色々な画像で試してみてね✨
⁡
-—————————————
AIRI SEKIGUCHI
⁡
お役立ち情報を発信するので
フォローしてね♡
" @aichan_webdesign "
⁡
⁡
ーやってることー
■現在270名を超える無料女性限定コミュニティ
（リスコミュ）を運営中
・女性限定の駆け出しデザイナーからベテランデザイナーの方までいます。
・勉強会や懇親会を月1.2回で開いてます
・興味ある方はお気軽に参加してね♡
→参加条件は最初にzoomで顔合わせ出来る方、女性、頑張りたい方、輪を乱さない方
⁡
⁡
参加方法は
①プロフィールに移動
②プロフィールのURL（LINE公式）をタップ
⁡
↓ ↓ ↓
ライン公式から友達追加して
『リスコミュ』と送ってね✨
⁡
もしくはInstagramのDMに
『リスコミュ』とメッセージしてね☺️
⁡
⁡
■ iris mama creative labo
リスラボ運営・代表
デザイン〜コーディングまで一貫して出来る強者ママを育成
⁡
⁡
■株式会社iris（Web制作会社）代表取締役
<サービス内容>
・ホームページ、LP制作
（デザイン〜コーディング）、Webサイト全般、システム開発
・印刷物（名刺、チラシ、パンフレット、
メニュー、ポスター等）
・映像編集
⁡
お問い合わせはDMからお願いします📩
⁡
⁡
-—————————————
⁡
#webデザイン
#webデザイナー
#Adobe
#AdobePhotoshop
#Photoshop

💡 保存必須！お洒落な縁取り画像の

💡 保存必須！お洒落な縁取り画像の作り方
をIllustratorで作成しよう！
⁡
①背景が透過された画像を用意する
②画像をコピーし、前面に複製する
③「画像トレース」パネルで各種設定をする
④「パスのオフセット｣で各種設定をする
⑤好きな色に変更して元画像の下に移動する
⑥ドロップシャドウをつける
⑦お洒落な縁取り画像の完成
⁡
この投稿を保存して、何度も見返せるようにしてね✨
⁡
——————————————————————
・無料の女性限定コミュニティ「リスコミュ」を運営中
・Webデザインスクール「リスラボ」では自立するママを育成中！
・株式会社iris（Web制作会社）代表取締役
・初心者向けに超有益なWebデザインブログ（デザイン〜コーディング、WordPress化）を運営中
⁡
詳しくはプロフィールをチェックしてね！
@aichan_webdesign
⁡
#Adobe
#AdobeIllustrator
#Illustrator
#webデザイン
#webデザイナー

💡これは便利！裾をフレアにする方法
をPhotoshopで作成しよう！
⁡
①画像を用意する
②｢選択ツール｣で伸ばしたい部分を作成する
③選択範囲を複製する
④｢自由変形モード｣に切り替える
⑤｢ワープ：｣の設定を
　｢貝殻（下向き）｣に変更する
⑥変形ハンドルを動かして裾の伸縮を調整する
⑦ 裾をフレアにした画像の完成
⁡
この投稿を保存して、何度も見返せるようにしてね✨
⁡
——————————————————————
・無料の女性限定コミュニティ「リスコミュ」を運営中
・Webデザインスクール「リスラボ」では自立するママを育成中！
・株式会社iris（Web制作会社）代表取締役
・初心者向けに超有益なWebデザインブログ（デザイン〜コーディング、WordPress化）を運営中
⁡
詳しくはプロフィールをチェックしてね！
@aichan_webdesign
⁡
#Adobe
#AdobePhotoshop
#Photoshop
#webデザイン
#webデザイナー

@aichan_webdesign ←壁に沿って文字を入れる方法知ってる？

今日のリールは
「壁に沿って文字を入れる方法」について
解説してみたよ！

①編集する画像を用意
②テキストを入力
③文字の選択範囲を作成＆コピーしてからレイヤーを非表示にする
④新規レイヤーを作成して「フィルター」→「消点」を選択
⑤壁に沿って面を作成
⑥文字の大きさを調整
⑦レイヤースタイルを調整
⑧壁に沿って文字を入れた画像の完成

文字以外にもロゴを入れたり
モックアップとしても使えるから
色々な素材で試してみるのも面白いです✨⁡
⁡
⁡
-—————————————
AIRI SEKIGUCHI
⁡
お役立ち情報を発信するので
フォローしてね♡
" @aichan_webdesign "
⁡
⁡
ーやってることー
■現在270名を超える無料女性限定コミュニティ
（リスコミュ）を運営中
・女性限定の駆け出しデザイナーからベテランデザイナーの方までいます。
・勉強会や懇親会を月1.2回で開いてます
・興味ある方はお気軽に参加してね♡
→参加条件は最初にzoomで顔合わせ出来る方、女性、頑張りたい方、輪を乱さない方
⁡
⁡
参加方法は
①プロフィールに移動
②プロフィールのURL（LINE公式）をタップ
⁡
↓ ↓ ↓
ライン公式から友達追加して
『リスコミュ』と送ってね✨
⁡
もしくはInstagramのDMに
『リスコミュ』とメッセージしてね☺️
⁡
⁡
■ iris mama creative labo
リスラボ運営・代表
デザイン〜コーディングまで一貫して出来る強者ママを育成
⁡
⁡
■株式会社iris（Web制作会社）代表取締役
<サービス内容>
・ホームページ、LP制作
（デザイン〜コーディング）、Webサイト全般、システム開発
・印刷物（名刺、チラシ、パンフレット、
メニュー、ポスター等）
・映像編集
⁡
お問い合わせはDMからお願いします📩
⁡
⁡
-—————————————
⁡
#webデザイン
#webデザイナー
#Adobe
#AdobePhotoshop
#Photoshop

💡 超楽しい！お絵描きに色を付ける

💡 超楽しい！お絵描きに色を付ける方法
をIllustratorで作成しよう！
⁡
①お絵描きのイラストを写真で撮る
②画像を配置して埋め込む
③「画像トレース｣パネルから「トレース｣を選択
④パネルの数値を調整して「拡張」する
⑤「ライブペイント｣ツールを選択する
⑥「ライブペイントツール」で色を付けていく
⑦色を付けたお絵描きのイラストが完成
⁡
⁡
この投稿を保存して、何度も見返せるようにしてね✨
⁡
——————————————————————
・無料の女性限定コミュニティ「リスコミュ」を運営中
・Webデザインスクール「リスラボ」では自立するママを育成中！
・株式会社iris（Web制作会社）代表取締役
・初心者向けに超有益なWebデザインブログ（デザイン〜コーディング、WordPress化）を運営中
⁡
詳しくはプロフィールをチェックしてね！
@aichan_webdesign
⁡
#Adobe
#AdobeIllustrator
#Illustrator
#webデザイン
#webデザイナー

💡保存必須！柔らかく照らす自然光加工
をPhotoshopで作成しよう！
⁡
①画像を用意する
②画像を暗めに調整する
③｢多角形選択ツール｣で差し込む光の形を作成
④上のレイヤーの明るさを調整
⑤選択とマスク｣でぼかしの数値を調整
⑥柔らかい自然な光を加えたお洒落な画像の完成
⁡
この投稿を保存して、何度も見返せるようにしてね✨
⁡
——————————————————————
・無料の女性限定コミュニティ「リスコミュ」を運営中
・Webデザインスクール「リスラボ」では自立するママを育成中！
・株式会社iris（Web制作会社）代表取締役
・初心者向けに超有益なWebデザインブログ（デザイン〜コーディング、WordPress化）を運営中
⁡
詳しくはプロフィールをチェックしてね！
@aichan_webdesign
⁡
#Adobe
#AdobePhotoshop
#Photoshop
#webデザイン
#webデザイナー

@aichan_webdesign←あなたは何問分かる？

@aichan_webdesign←あなたは何問分かる？

Webデザイナーなら知らなきゃやばい
デザイン常識クイズ！！

もし、答えられない問題があったら
今日でちゃんと覚えて✨

-—————————————
AIRI SEKIGUCHI
⁡
お役立ち情報を発信するので
フォローしてね♡
" @aichan_webdesign "
⁡
⁡
ーやってることー
■現在270名を超える無料女性限定コミュニティ
（リスコミュ）を運営中
・女性限定の駆け出しデザイナーからベテランデザイナーの方までいます。
・勉強会や懇親会を月1.2回で開いてます
・興味ある方はお気軽に参加してね♡
→参加条件は最初にzoomで顔合わせ出来る方、女性、頑張りたい方、輪を乱さない方
⁡
⁡
参加方法は
①プロフィールに移動
②プロフィールのURL（LINE公式）をタップ
⁡
↓ ↓ ↓
ライン公式から友達追加して
『リスコミュ』と送ってね✨
⁡
もしくはInstagramのDMに
『リスコミュ』とメッセージしてね☺️
⁡
⁡
■ iris mama creative labo
リスラボ運営・代表
デザイン〜コーディングまで一貫して出来る強者ママを育成
⁡
⁡
■株式会社iris（Web制作会社）代表取締役
<サービス内容>
・ホームページ、LP制作
（デザイン〜コーディング）、Webサイト全般、システム開発
・印刷物（名刺、チラシ、パンフレット、
メニュー、ポスター等）
・映像編集
⁡
お問い合わせはDMからお願いします📩
⁡
⁡
-—————————————
⁡
#webデザイン
#webデザイナー
#Photoshop
#adobephotoshop

💡超簡単！飛び出す３D文字加工をIl

💡超簡単！飛び出す３D文字加工
をIllustratorで作成しよう！
⁡
①「文字ツール｣でベースとなる文字を打ち込む
②「アピアランスパネル｣で
　背景となる｢塗り｣を設定
③前面に飛び出す文字の色を設定する
④「パスのオフセット」を設定する
⑤「新規効果を追加」で「パスの変形」を選択する
⑥「変形効果パネル」で数値を設定する
⑦飛び出したような３D文字の加工が完成
⁡
この投稿を保存して、何度も見返せるようにしてね✨
⁡
——————————————————————
・無料の女性限定コミュニティ「リスコミュ」を運営中
・Webデザインスクール「リスラボ」では自立するママを育成中！
・株式会社iris（Web制作会社）代表取締役
・初心者向けに超有益なWebデザインブログ（デザイン〜コーディング、WordPress化）を運営中
⁡
詳しくはプロフィールをチェックしてね！
@aichan_webdesign
⁡
#Adobe
#AdobeIllustrator
#Illustrator
#webデザイン
#webデザイナー

💡簡単お洒落！隙間を空ける文字の重ね方
をPhotoshopで作成しよう！
⁡
①背景の上に画像と好きな文字を乗せる
②文字の位置を調整しレイヤーをグループ化する
③レイヤーマスクをかける
④文字の選択範囲を作成する
⑤選択範囲を拡張する
⑥塗りつぶしをする
⑦重なる部分に隙間を空けた文字の完成
⁡
この投稿を保存して、何度も見返せるようにしてね✨
⁡
——————————————————————
・無料の女性限定コミュニティ「リスコミュ」を運営中
・Webデザインスクール「リスラボ」では自立するママを育成中！
・株式会社iris（Web制作会社）代表取締役
・初心者向けに超有益なWebデザインブログ（デザイン〜コーディング、WordPress化）を運営中
⁡
詳しくはプロフィールをチェックしてね！
@aichan_webdesign
⁡
#Adobe
#AdobePhotoshop
#Photoshop
#webデザイン
#webデザイナー

@aichan_webdesign←自然なチークの入れ方

@aichan_webdesign←自然なチークの入れ方を教えちゃうよ✨

人物の画像を使いたいけど、もう少し華やかにしたい！
そんな時に使える自然なチークの入れ方を紹介するよ！

①用意した写真のチークを入れたい部分を、なげなわツールで囲む
②レイヤー→新規調整レイヤーから、トーンカーブを選ぶ
③トーンカーブの操作パネルの、「RGB」をクリックし、「レッド」を選ぶ
④トーンカーブの中間あたりを上に向かってドラッグする
⑤マスクを押して、ぼかしのスライダーを動かして自然な濃さにする
⑥不透明度を少し下げる
⑦画像に馴染んだチークの完成✨　
⁡
⁡寂しい印象の写真も、簡単な編集で華やかな印象に変えられるから、
見返せるように保存して、活用してみてね✨⁡⁡
⁡
⁡
-—————————————
AIRI SEKIGUCHI
⁡
お役立ち情報を発信するので
フォローしてね♡
" @aichan_webdesign "
⁡
⁡
ーやってることー
■現在270名を超える無料女性限定コミュニティ
（リスコミュ）を運営中
・女性限定の駆け出しデザイナーからベテランデザイナーの方までいます。
・勉強会や懇親会を月1.2回で開いてます
・興味ある方はお気軽に参加してね♡
→参加条件は最初にzoomで顔合わせ出来る方、女性、頑張りたい方、輪を乱さない方
⁡
⁡
参加方法は
①プロフィールに移動
②プロフィールのURL（LINE公式）をタップ
⁡
↓ ↓ ↓
ライン公式から友達追加して
『リスコミュ』と送ってね✨
⁡
もしくはInstagramのDMに
『リスコミュ』とメッセージしてね☺️
⁡
⁡
■ iris mama creative labo
リスラボ運営・代表
デザイン〜コーディングまで一貫して出来る強者ママを育成
⁡
⁡
■株式会社iris（Web制作会社）代表取締役
<サービス内容>
・ホームページ、LP制作
（デザイン〜コーディング）、Webサイト全般、システム開発
・印刷物（名刺、チラシ、パンフレット、
メニュー、ポスター等）
・映像編集
⁡
お問い合わせはDMからお願いします📩
⁡
⁡
-—————————————
⁡
#webデザイン
#webデザイナー
#Photoshop
#adobephotoshop

💡 簡単キレイ！図形でグラデを作る

💡 簡単キレイ！図形でグラデを作る方法
をIllustratorで作成しよう！
⁡
①「図形ツール」で図形を作成する
②好きな位置に図形を配置する
③配置した図形に好みの色を設定する
④「ブレンドツール」を選択する
⑤図形を順にクリックする
⑥図形で作られたグラデーションの完成
⁡
この投稿を保存して、何度も見返せるようにしてね✨
⁡
——————————————————————
・無料の女性限定コミュニティ「リスコミュ」を運営中
・Webデザインスクール「リスラボ」では自立するママを育成中！
・株式会社iris（Web制作会社）代表取締役
・初心者向けに超有益なWebデザインブログ（デザイン〜コーディング、WordPress化）を運営中
⁡
詳しくはプロフィールをチェックしてね！
@aichan_webdesign
⁡
#Adobe
#AdobeIllustrator
#Illustrator
#webデザイン
#webデザイナー

💡 超お洒落！光でエモさを演出する

💡 超お洒落！光でエモさを演出する方法
をPhotoshopで作成しよう！
⁡
①加工したい画像を用意し
　長方形ツールで光の形を作る
②01の工程で作成したものを
　スマートオブジェクト化する
③選択範囲を作成してレイヤーを非表示にする
④調整レイヤー→「レベル補正」をクリック
⑤つまみを動かし光加減を調整する
⑥｢フィルター｣→｢ぼかし｣→
　｢ぼかし(ガウス)｣を選択
⑦光でエモさを演出した画像の完成
⁡
この投稿を保存して、何度も見返せるようにしてね✨
⁡
——————————————————————
・無料の女性限定コミュニティ「リスコミュ」を運営中
・Webデザインスクール「リスラボ」では自立するママを育成中！
・株式会社iris（Web制作会社）代表取締役
・初心者向けに超有益なWebデザインブログ（デザイン〜コーディング、WordPress化）を運営中
⁡
詳しくはプロフィールをチェックしてね！
@aichan_webdesign
⁡
#Adobe
#AdobePhotoshop
#Photoshop
#webデザイン
#webデザイナー

さらに読み込む Instagram でフォロー

X

Tweets by mama_beyourself

関口愛里

株式会社iris代表取締役

■Web制作会社を経営
■女性の自立をサポートするWebデザインスクール運営
■現在250名超えの女性限定のWebデザインチームを運営
■Webデザイナーを目指したい方に向けてWebデザイナーになるために必要な勉強方法〜現場のリアルを発信していきます。

instagram

aichan_webdesign

誰でも分かるWebデザインの知識をInstagramでも毎日配信中↓ デザイン、コーディング、Webデザイナーに必要な知識etc

💡 これ知ってる？爆速でできる小技

💡 これ知ってる？爆速でできる小技集
をIllustratorで作成しよう！
⁡
①＜その１＞一瞬で別のオブジェクトに変える小技
② 一瞬で別のオブジェクトに変える方法
③＜その2＞離れたパスを一瞬でつなげる小技
④ 離れたパスを一瞬でつなげる方法
⑤＜その3＞「角」の形状を一瞬で変える小技
⑥ 「角」の形状を一瞬で変更する方法
⑦まとめ
⁡
この投稿を保存して、何度も見返せるようにしてね✨
⁡
——————————————————————
・無料の女性限定コミュニティ「リスコミュ」を運営中
・Webデザインスクール「リスラボ」では自立するママを育成中！
・株式会社iris（Web制作会社）代表取締役
・初心者向けに超有益なWebデザインブログ（デザイン〜コーディング、WordPress化）を運営中
⁡
詳しくはプロフィールをチェックしてね！
@aichan_webdesign
⁡
#Adobe
#AdobeIllustrator
#Illustrator
#webデザイン
#webデザイナー

💡 超便利！一番簡単な削除&生成法
をPhotoshopで作成しよう！
⁡
①不要な被写体を削除する方法
②なげなわツールで不要なものを囲う
③｢生成塗りつぶし｣を選択→空白のまま生成
④不要な被写体の削除が完了
⑤被写体を別の物に置き換える方法
⑥プロンプトを入力し生成する
⑦別の物への置き換え完了
⁡
この投稿を保存して、何度も見返せるようにしてね✨
⁡
——————————————————————
・無料の女性限定コミュニティ「リスコミュ」を運営中
・Webデザインスクール「リスラボ」では自立するママを育成中！
・株式会社iris（Web制作会社）代表取締役
・初心者向けに超有益なWebデザインブログ（デザイン〜コーディング、WordPress化）を運営中
⁡
詳しくはプロフィールをチェックしてね！
@aichan_webdesign
⁡
#Adobe
#AdobePhotoshop
#Photoshop
#webデザイン
#webデザイナー

@aichan_webdesign ←躍動感がすごい、動きのある画像の作り方知ってる？

今日のリールは
「躍動感がすごい！動きのある画像の作り方」について
解説してみたよ！

①編集する画像を用意する
②被写体を選択して選択範囲を複製
③パスぼかしで残像を作成
④グラデーションで好みのカラーを設定
⑤クリッピングマスクをかける
⑥描画モードを「オーバーレイ」に設定
⑦躍動感がすごい、動きのある画像の完成

パスの向きや速度を変えるだけで
ぼかしのかかり方がかわるから
色々試してみてね✨
⁡
⁡
⁡
-—————————————
AIRI SEKIGUCHI
⁡
お役立ち情報を発信するので
フォローしてね♡
" @aichan_webdesign "
⁡
⁡
ーやってることー
■現在270名を超える無料女性限定コミュニティ
（リスコミュ）を運営中
・女性限定の駆け出しデザイナーからベテランデザイナーの方までいます。
・勉強会や懇親会を月1.2回で開いてます
・興味ある方はお気軽に参加してね♡
→参加条件は最初にzoomで顔合わせ出来る方、女性、頑張りたい方、輪を乱さない方
⁡
⁡
参加方法は
①プロフィールに移動
②プロフィールのURL（LINE公式）をタップ
⁡
↓ ↓ ↓
ライン公式から友達追加して
『リスコミュ』と送ってね✨
⁡
もしくはInstagramのDMに
『リスコミュ』とメッセージしてね☺️
⁡
⁡
■ iris mama creative labo
リスラボ運営・代表
デザイン〜コーディングまで一貫して出来る強者ママを育成
⁡
⁡
■株式会社iris（Web制作会社）代表取締役
<サービス内容>
・ホームページ、LP制作
（デザイン〜コーディング）、Webサイト全般、システム開発
・印刷物（名刺、チラシ、パンフレット、
メニュー、ポスター等）
・映像編集
⁡
お問い合わせはDMからお願いします📩
⁡
⁡
-—————————————
⁡
#webデザイン
#webデザイナー
#Adobe
#AdobePhotoshop
#Photoshop

💡とっても便利！編集できるマーカーの作り方
をIllustratorで作成しよう！
⁡
①テキストツールで文字を入力する
②｢パスファインダー｣→
　｢複合シェイプを作成｣を選択
③ ｢アピアランス｣で新規塗りを追加する
④ ｢形状に変換｣→｢長方形｣を選択
⑤「形状オプション｣で幅と高さを調整する
⑥ ｢パスの変形｣→｢変形｣で
　マーカーの位置を調整する
⑦編集できるマーカーの完成
⁡
この投稿を保存して、何度も見返せるようにしてね✨
⁡
——————————————————————
・無料の女性限定コミュニティ「リスコミュ」を運営中
・Webデザインスクール「リスラボ」では自立するママを育成中！
・株式会社iris（Web制作会社）代表取締役
・初心者向けに超有益なWebデザインブログ（デザイン〜コーディング、WordPress化）を運営中
⁡
詳しくはプロフィールをチェックしてね！
@aichan_webdesign
⁡
#Adobe
#AdobeIllustrator
#Illustrator
#webデザイン
#webデザイナー

💡 一瞬でできる！スプレー加工を自

💡 一瞬でできる！スプレー加工を自然に再現
をPhotoshopで作成しよう！
⁡
①加工したい画像を開き、
　新しいレイヤーを上に追加
②ブラシの色を白にして、クリックで点を描く
③ブラシで描いたレイヤーの不透明度を下げる
④｢編集｣→｢変形｣→｢遠近法｣を選択する
⑤左上の角をクリック→右方向に動かしねじる
⑥下の部分だけを長方形選択ツールで囲って削除
⑦噴射口に配置すれば、
　自然なスプレー加工の完成
⁡
この投稿を保存して、何度も見返せるようにしてね✨
⁡
——————————————————————
・無料の女性限定コミュニティ「リスコミュ」を運営中
・Webデザインスクール「リスラボ」では自立するママを育成中！
・株式会社iris（Web制作会社）代表取締役
・初心者向けに超有益なWebデザインブログ（デザイン〜コーディング、WordPress化）を運営中
⁡
詳しくはプロフィールをチェックしてね！
@aichan_webdesign
⁡
#Adobe
#AdobePhotoshop
#Photoshop
#webデザイン
#webデザイナー

【なっちゃん】とコメントすると対談動画が見れます✨️
⁡
@aichan_webdesign
⁡
————————————
⁡
今日はリスラボ1期性
なっちゃんの卒業後実績を紹介するよ！
⁡
【なっちゃんの実績】
・1児のシングルマザー
・コーダーとして活動
・irisのメインコーダーに抜擢

⁡
▪️Q&A

Q.リスラボに入る前は何をしていましたか？

A. 料理人の仕事をしながらフリーランスを目指してwebデザインを学んでいました。
 
Q.どんな事に悩んでいましたか？

A. 他のwebデザインスクールを卒業しましたが、自力で案件も取れず、実力不足を痛感していました。
 
Q.リスラボに入会しようと思った
きっかけはなんですか？

　A. 実力不足で悩んでいる時、愛ちゃんに出会い、愛ちゃん「ママだって輝ける」という言葉がとても刺さり、入会を決めました。
⁡
⁡
Q.リスラボに実際入ってみてどうでしたか？ 
⁡　A. webデザインのスキルだけでなく、マインドも大きく変わり、人生を変えるきっかけになりました！
⁡
————————————
⁡
なかなかうまくいかないあなた。
努力の方向性が間違ってないですか？
⁡
本気で頑張れば半年あれば人生は変わります。
⁡
1人で悩んでる方は遠慮なくDMで相談してください😌
⁡
————————————
・無料の女性限定コミュニティ「リスコミュ」を運営中
・Webデザインスクール「リスラボ」では自立するママを育成中！
・株式会社iris（Web制作会社）代表取締役
・初心者向けに超有益なWebデザインブログ（デザイン〜コーディング、WordPress化）を運営中
⁡
詳しくはプロフィールをチェックしてね！
@aichan_webdesign
⁡

#webデザイン
#webデザイナー
#ママWebデザイナー

💡超便利！画像からフォントを検索する方法
をIllustratorで作成しよう！
⁡
①調べたいフォントの画像を配置する
②「Retype」を選択する
③ 調べたい範囲を指定する
④ 「Retype」パネルで検索結果を確認する
⑤フォントが見つかったら
　｢クリックして追加」する
⑥画像からフォントの検索が完了
⁡
この投稿を保存して、何度も見返せるようにしてね✨
⁡
——————————————————————
・無料の女性限定コミュニティ「リスコミュ」を運営中
・Webデザインスクール「リスラボ」では自立するママを育成中！
・株式会社iris（Web制作会社）代表取締役
・初心者向けに超有益なWebデザインブログ（デザイン〜コーディング、WordPress化）を運営中
⁡
詳しくはプロフィールをチェックしてね！
@aichan_webdesign
⁡
#Adobe
#AdobeIllustrator
#Illustrator
#webデザイン
#webデザイナー

💡これは凄い！水のような文字の作り方
をPhotoshopで作成しよう！
⁡
①好きな背景や画像の上に文字を打ち込む
②描画モードを変更する
③ ｢ベベルとエンボス｣を適用する
④「光彩（内側）」を適用する
⑤「シャドウ(内側)｣を適用する
⑥ ｢ドロップシャドウ｣を適用する
⑦水のような質感の文字が完成
⁡
この投稿を保存して、何度も見返せるようにしてね✨
⁡
——————————————————————
・無料の女性限定コミュニティ「リスコミュ」を運営中
・Webデザインスクール「リスラボ」では自立するママを育成中！
・株式会社iris（Web制作会社）代表取締役
・初心者向けに超有益なWebデザインブログ（デザイン〜コーディング、WordPress化）を運営中
⁡
詳しくはプロフィールをチェックしてね！
@aichan_webdesign
⁡
#Adobe
#AdobePhotoshop
#Photoshop
#webデザイン
#webデザイナー

@aichan_webdesign ←違和感なくライトを明るくする方法知ってる？

今日のリールは
「違和感なくライトを明るくする方法」について
解説してみたよ！

①編集する画像を用意する
②新規レイヤーを追加して選択範囲を作成
③選択範囲を白で塗りつぶし、不透明度を下げる
④レイヤー効果の設定
⑤ぼかし（ガウス）をかける
⑥新規レイヤーを追加してブラシツールで光を足す
⑦④と同様にレイヤー効果の設定
⑧自然にライトをつけた画像の完成

描画モードをオーバーレイにするだけで
⁡自然な光をつけることができるから
⁡色々な画像で試してみてね✨
⁡
-—————————————
AIRI SEKIGUCHI
⁡
お役立ち情報を発信するので
フォローしてね♡
" @aichan_webdesign "
⁡
⁡
ーやってることー
■現在270名を超える無料女性限定コミュニティ
（リスコミュ）を運営中
・女性限定の駆け出しデザイナーからベテランデザイナーの方までいます。
・勉強会や懇親会を月1.2回で開いてます
・興味ある方はお気軽に参加してね♡
→参加条件は最初にzoomで顔合わせ出来る方、女性、頑張りたい方、輪を乱さない方
⁡
⁡
参加方法は
①プロフィールに移動
②プロフィールのURL（LINE公式）をタップ
⁡
↓ ↓ ↓
ライン公式から友達追加して
『リスコミュ』と送ってね✨
⁡
もしくはInstagramのDMに
『リスコミュ』とメッセージしてね☺️
⁡
⁡
■ iris mama creative labo
リスラボ運営・代表
デザイン〜コーディングまで一貫して出来る強者ママを育成
⁡
⁡
■株式会社iris（Web制作会社）代表取締役
<サービス内容>
・ホームページ、LP制作
（デザイン〜コーディング）、Webサイト全般、システム開発
・印刷物（名刺、チラシ、パンフレット、
メニュー、ポスター等）
・映像編集
⁡
お問い合わせはDMからお願いします📩
⁡
⁡
-—————————————
⁡
#webデザイン
#webデザイナー
#Adobe
#AdobePhotoshop
#Photoshop

Instagram でフォロー

カテゴリ一覧

デザイン (106)
フリーランス (9)
プログラミング (55)
未分類 (6)

タグ一覧

adobe Figma Google Chrome HTML&CSS Illustrator JavaScript Photoshop Sass VS Code Webデザイナー Webデザイン Web制作 WordPress コーディングデザイン基礎バナーフォントフリーランスフリー素材ポートフォリオ制作実績

Home
プライバシーポリシー

© 2024 iris inc.