MENU
  • Home
  • My Blog
  • Community
rislabo Web Design Blog
  • Home
  • My Blog
  • Community
  1. ホーム
  2. Webデザイナー

Webデザイナー– tag –

  • その他

    サイズ違いも自由自在!バナーのバリエーション作成

    2024年11月26日
  • その他

    Zoomをもっと使いこなす!便利機能について

    2024年11月24日
  • Photoshop

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

    2024年11月24日
  • Photoshop

    Photoshopで人物写真をレタッチ(補正)する方法

    2024年11月24日
  • その他

    クラウド保存はこれで完璧!丸わかりガイド

    2024年11月23日
  • Illustrator

    便利すぎる!編集できない文字のフォント検索方法

    2024年11月14日
123...23
検索
関口 愛里
株式会社iris代表取締役
■Web制作会社を経営
■女性の自立をサポートするWebデザインスクール運営
■現在140名超えの女性限定のWebデザインチームを運営
■Webデザイナーを目指したい方に向けてWebデザイナーになるために必要な勉強方法〜現場のリアルを発信していきます。
カテゴリ一覧
  • デザイン (106)
    • Figma (24)
    • Illustrator (34)
    • Photoshop (27)
    • その他 (7)
  • フリーランス (9)
  • プログラミング (55)
    • HTML&CSS (27)
    • JavaScript (7)
    • Sass (2)
    • WordPress (4)
    • その他 (9)
    • 環境構築 (5)
  • 未分類 (6)
タグ一覧
adobe Figma Google Chrome HTML&CSS Illustrator JavaScript Photoshop Sass VS Code Webデザイナー Webデザイン Web制作 WordPress コーディング デザイン基礎 バナー フォント フリーランス フリー素材 ポートフォリオ 制作実績
instagram
あいり|ママWebデザイナーを育成するプロ

aichan_webdesign

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

💡 一瞬でできる!スプレー加工を自 💡 一瞬でできる!スプレー加工を自然に再現
を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
💡超簡単!飛び出す3D文字加工 をIl 💡超簡単!飛び出す3D文字加工
をIllustratorで作成しよう!
⁡
①「文字ツール」でベースとなる文字を打ち込む
②「アピアランスパネル」で
 背景となる「塗り」を設定
③前面に飛び出す文字の色を設定する
④「パスのオフセット」を設定する
⑤「新規効果を追加」で「パスの変形」を選択する
⑥「変形効果パネル」で数値を設定する
⑦飛び出したような3D文字の加工が完成
⁡
この投稿を保存して、何度も見返せるようにしてね✨
⁡
——————————————————————
・無料の女性限定コミュニティ「リスコミュ」を運営中
・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デザイナー
@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おすすめの 【ストレス発散法】をコメントしてね!

お待たせしました!!

現在、参加者150名突破🎉

"ただのデザイナーはもう生き残れない"
3DAYS CAMP 売れるLPデザイン制作チャレンジの詳細がDMに届きます✨️

・低単価地獄で辛い・・・
・なんとなくでLPのデザインを作ってしまっている
・現場で求められるLPを作れる自信がない

こんなお悩みを抱えてる方はぜひ!!

#Webデザイン
さらに読み込む Instagram でフォロー
X
Tweets by mama_beyourself
関口 愛里
株式会社iris代表取締役
■Web制作会社を経営
■女性の自立をサポートするWebデザインスクール運営
■現在250名超えの女性限定のWebデザインチームを運営
■Webデザイナーを目指したい方に向けてWebデザイナーになるために必要な勉強方法〜現場のリアルを発信していきます。
instagram
あいり|ママWebデザイナーを育成するプロ

aichan_webdesign

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

💡 一瞬でできる!スプレー加工を自 💡 一瞬でできる!スプレー加工を自然に再現
を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デザイナー
Instagram でフォロー
カテゴリ一覧
  • デザイン (106)
    • Figma (24)
    • Illustrator (34)
    • Photoshop (27)
    • その他 (7)
  • フリーランス (9)
  • プログラミング (55)
    • HTML&CSS (27)
    • JavaScript (7)
    • Sass (2)
    • WordPress (4)
    • その他 (9)
    • 環境構築 (5)
  • 未分類 (6)
タグ一覧
adobe Figma Google Chrome HTML&CSS Illustrator JavaScript Photoshop Sass VS Code Webデザイナー Webデザイン Web制作 WordPress コーディング デザイン基礎 バナー フォント フリーランス フリー素材 ポートフォリオ 制作実績
  • Home
  • プライバシーポリシー

© 2024 iris inc.