前回、投稿IDを入力すると、入力したIDのタイトル、サムネイル、リンクを取得して表示するものを作成しました。
しかし、実際の表示を確認するには、プレビューを開くか、保存をしてページを開かないと確認ができませんでした。

もう少し使いやすくするために、ブロックにプレビュー機能を付けたいと思います。
プレビュー機能を付けることにより、編集画面上でも実際の表示を確認できます。
※ソースは前回のものを使用します。

ServerSideRenderコンポーネント

ServerSideRenderコンポーネントを使用すると、編集画面でrender_callback関数に基づいたレンダリングを確認できます。

ServerSideRender コンポーネントを@wordpress/editor パッケージからインポートします。

ServerSideRenderコンポーネントは、ブロックの名前（識別子）をblockプロパティに指定する必要があります。
これはprops.nameで取得ができます

レンダリングに必要な情報（ここでは、投稿ID）をattributeプロパティに指定します。

src/edit.js

//SeverSideRenderコンポーネントをインポート
import { ServerSideRender } from '@wordpress/editor';

export default function Edit(props) {
	//props経由でプロパティを変数に分割代入
	const {attributes: {postID}, setAttributes, className} = props;
	
	return (
		<div className={className} { ...useBlockProps() }>
			{/* プレビューと分けるため編集部分を div class="editMode" で囲む */}
			<div class="editMode">
				<div>sample dynamic block</div>
				<TextControl
					label='投稿IDを入力' //ラベルの表記を設定
					type='number' //inputタグのtypeを設定
					value={postID} //保存されている属性（投稿ID）を表示
					//入力された値を属性に登録する
					onChange={ ( newId ) => setAttributes({ postID: parseInt(newId) })}
				/>
			</div>

			{/* ServerSideRenderコンポーネントを追加 */}
			<div class="previewMode">
				<div>プレビュー</div>
				<ServerSideRender
					block={props.name} //ブロックの名前（識別子）を設定
					attributes={{
						postID: postID //保存されている属性（投稿ID）を表示
					}}
				/>
			</div>
		</div>
	);
}

プレビュー部分が見ずらいので、少し出力するHTMLとCSSを編集します。

sample-dynamic-block.php

本文の冒頭部分を表示するように編集します。

function sample_dynamic_block_render($attr, $content) {
	if($attr['postID'] > 0) {

		    //省略

			//本文の一部を取得
			$postContent = strip_tags($selectPost->post_content);
			$postContent = trim($postContent);
			$excerpt = mb_substr($postContent, 0, 75);

			//出力されるHTMLを編集
			ob_start();
			?>
			<div>
				<a class="postWrap" href="<?php print $link; ?>">
					<img src="<?php print $thumbUrl; ?>">
					<div class="postDetail">
						<div class=postTitle>
							<?php print $title; ?>
						</div>
						<p class="excerpt"><?php print $excerpt ?></p>
					</div>
				</a>
			</div>
			<?php
			$output = ob_get_contents();
			ob_end_clean();

			return $output;
		}
	}
}

src/editor.scss

編集画面のみ適用されるので、実際のページも同じデザインにする場合は、
src/sytle.scss を編集する必要があります。

.wp-block-create-block-sample-dynamic-block {
	border: 1px dotted #f00;

	/* 追加 */
	.previewMode {
		background: #fff;

		.previewTitle {
			color: #000;
		}

		img {
			width: 200px;
		}

		.postWrap  {
			display: flex;
			align-items: center;

			.postDetail {
				padding: 10px;

				.postTitle {
					margin-bottom: 8px;
				}
			}
		}

		a {
			display: inline-block;
		}
	}
}

投稿IDの入力の下にプレビューが表示されました。
※CSSは、実際に表示するデザインになる様に編集してください。

プレビューボタンの追加

プレビュー画面が常に表示されていると編集画面が見づらくなるので、
ツールバーにプレビューボタンを追加して、プレビュー表示と編集画面を切り替えられるようにします。

sample-dynamic-block.php

「attributes」に「isEditMode」（編集画面）を追加します。
現在の画面の状態（編集画面 or プレビュー）を表す属性になります。

function create_block_sample_dynamic_block_block_init() {
	register_block_type( __DIR__ . '/build', array(
		//レンダリング用のコールバック関数を設定
		'render_callback' => 'sample_dynamic_block_render',
		//入力された値（投稿ID）を保存するための属性を追記
		'attributes' => [
			'postID' => [
				'type' => 'number',
				'default' => 0
			],
			//表示画面の状態を管理する属性を追加
			'isEditMode' => [
				'type' => 'boolean',
				'default' => true
			]
		]
	));
}

src/edit.js

ツールバーにプレビューボタンを追加するので、
BlockControls、Button、Toolbar コンポーネントをインポートします。

//BlockControlsコンポーネントをインポート
import { BlockControls } from '@wordpress/block-editor';
//Button、Toolbarコンポーネントを追加
import { Button, Toolbar } from '@wordpress/components';

propsのisEditModeプロパティを変数に代入。

const {attributes: {postID, isEditMode}, setAttributes, className} = props;

ツールバーにプレビューボタンを追加して表示する関数（getBlockControls）を追加します。
ボタンの表示切替は、isEditModeの値により切り替わるようにします。

const getBlockControls = () => {
		return (
			<BlockControls>
				<Toolbar>
					<Button
						label={ isEditMode ? 'Preview' : 'Edit'} //isEditModeの値によって、ラベルを切り替える
						icon={ isEditMode ? 'format-image' : 'edit' } //isEditModeの値によって、アイコンを切替る
						className='read-together-btn'
						onClick={() => {
							//clickされると値が反転
							setAttributes({ isEditMode: !isEditMode })}
						}
					/>
				</Toolbar>
			</BlockControls>
		);
	}

出力内容部分もisEditModeの値によって、切り替わるように編集します。

return (
		[
			getBlockControls(),
			<div className={className} { ...useBlockProps() }>

				{/* trueの場合、編集画面を表示 */}
				{ isEditMode && 
					//プレビューと分けるため編集部分を div class="editMode" で囲む
					<div class="editMode">
						<div>sample dynamic block</div>
						<TextControl
							label='投稿IDを入力' //ラベルの表記を設定
							type='number' //inputタグのtypeを設定
							value={postID} //保存されている属性（投稿ID）を表示
							//入力された値を属性に登録する
							onChange={ ( newId ) => setAttributes({ postID: parseInt(newId) })}
						/>
					</div>
				}
				{/* falseの場合、プレビュー画面を表示 */}
				{ !isEditMode &&
					//ServerSideRenderコンポーネントを追加
					<div class="previewMode">
						<div class="previewTitle">プレビュー</div>
						<ServerSideRender
							block={props.name} //ブロックの名前（識別子）を設定
							attributes={{
								postID: postID //保存されている属性（投稿ID）を表示
							}}
						/>
					</div>
				}

			</div>
		]
	);

編集モード

プレビューモード

まとめ

今回、プレビュー機能を追加することで、編集画面上でも実際の表示を確認ができるようになり、
使いやすくなったと思います。

ツールバーへのボタン追加もいろいろと応用できるかと思いますので、
ぜひ、参考にしていただければと思います。

こんにちは、グリニッジのホアンです。
久しぶりにブログを更新しました。 
8月に約3年半ぶりのベトナムへ帰省しました。
今回はベトナム帰省での印象について共有させていただきます。

まずベトナムに入国する時、新型コロナウイルスのPCR検査やワクチン接種証明書などが不要なのでスムーズに入国できて、良かったです。
第一印象はコロナ前のように正常な生活が戻ってきて、町中でマスクをしていない人が多かったです。
ちなみに9月26日にはベトナム国内で感染者1432人が新たに確認されて、死者はいませんでした。

次に驚いたことは物価が上昇していることです。
ベトナムの通貨ドン（ベトナムドン、VNDとも言う）の為替レートは、1円＝170ドンとなっています。（2022年9月26日現在）
下記は参考の値段です。
フォー(ベトナムの代表的な食べ物)（1杯）185～433円
ガソリン（1L）　148～155円
タバコ（マルボロ：1箱）　185～247円
卵（1個）19～31円
数年前ベトナムの物価はだいたい日本の物価の1/3だと思いましたが、段々日本に近づいてきました。
もちろん熱帯の国なので、野菜や果物などまだ安い物も沢山あります。

成長するGrab（グラブ）

一方、生活面で、Grabのサービスに大きな展開がありました。
Grab（グラブ）とは、元々はマレーシアを拠点にサービスを開始し、東南アジア各国に拡大した自動車配車アプリですが、現在ベトナム生活に不可欠のサービスとなってきました。
当初は自動車配車サービスだけでしたが、現在バイク「Grab Bike」や食事の配達「Grab Food」やバイクで荷物を送る（Grab Delivery）など、様々な便利なサービスが出来てきました。
私も数回Grab Deliveryを利用してみましたが、距離はだいたい5kmぐらいで約250円。
すぐ荷物を送ってくれて、助かりました。

そして、3年半ぶりのホーチミン市も、新しい高いビルや橋などが出来ていて、経済が発展していることを感じました。

ちなみに、英系ファンド運用会社ビナキャピタルにより、ベトナムの経済展望に対する楽観的な見方と、株価が今後上昇していくとの見通しを示し、2020年代のベトナム経済は、その後数十年にわたるグローバルバリューチェーンへのつながりを始めた1970年代日本経済との相似性があると評価しました。
なお、ベトナムの国内総生産(GDP)成長予測を大幅に上方修正しており、ベトナムは今年+8％の成長をすると期待する経済専門家も多いです。

ベトナムのオンラインショッピング

経済が発展しているし、若いものが多いし、インターネット利用者も多いため、オンラインショッピングの利用率が伸びています。
EC市場の22年売上高は+20％増の2.35兆円に達する見通しです。
調査により、ベトナムのインターネット利用者は人口の75％、インターネット利用者のうち74.8％がオンラインショッピングを利用しているそうです。
購入が最も多いのは、衣料品・履物・化粧品、家庭用品、IT・電子機器、書籍・花・ギフト、食品などで、注文に使用するデバイスは携帯電話が91％で最も多いです。

市場調査各社は、ベトナムのECは今後も引き続き成長し、2025年に390億USD(約5兆5800億円)規模に到達し、シンガポールと並んで、インドネシアの1040億USD(14兆8700億円)に次ぐASEAN2位になると予想しています。
今回、ベトナムに滞在した時、ベトナム大手通販サイトShopeeでオンラインショッピングを試してみて、スムーズに物を購入できました。

以上が今回のベトナム帰省で、私が感じた変化していることでした。
今後、ベトナムの発展を期待し、いつか弊社のサービスもインドネシアやベトナムなど東南アジア市場へ進出できたら良いなと思っています。

こんにちは。
突然ですが、みなさんはお店にお問合せを送ったことがありますか？

今まで、不良品のお問合せや、対応の不備で使うものだと思っていましたが、良かった点や要望を伝えるといった使い方を最近はしています。

直接きもちをお店に伝えることでうれしい発見があったので、ご紹介いたします。

現場の成果を伝えられる

服屋の店員さんの対応が丁寧でよかったため、本部に伝えたいと思い、お問合せを送りました。

自分は一度店内を見てから、用があったら声をかける方が買い物しやすく、店員さんはそのような接客をおこなってくれました。
質問への丁寧な対応、取りにくい場所の服をとってくれる、セール時の計算方法など買い物の終了まで見ていただいたことなど、具体的にしていただいたことを記載しました。

また、ほめることだけが目的ではなく、この感謝の気持ちがその方の評価につながればいいと思って、具体的なスタッフの詳細と評価につなげてほしいことを書きました。

お店からの返事には、お店利用への感謝と、教育の成果がでていることがわかったと書かれていました。

どういうことかというと、コロナ禍で接客スタイルを変えていたようです。
以前のように距離の近い接客ができない中で、どうすればお客様に満足してもらえるのか考えながら教育をしていたそうです。
今回、直接「満足した」と聞けたことで、スタッフに教育が身についていること、しっかりと成果としてでていることに安心していました。

お返事がいただけたことがまず嬉しく、伝えたかったことが本部にも現場スタッフにもきちんと伝わったことも嬉しく、また同じ店に行ってみようという気持ちになれます。

要望を伝えられる

直接、ご要望を送るのも効果的です。映画館で映画を見ることが好きなので、映画館にも要望をよく送っています。

映画館に上映を延長してほしい場合、直接、電話や問い合わせで伝えることがいちばん効果的だそうです。
新作ラッシュで先のスケジュールが決まっている場合もありますが、それが終わったらまたいれてくれる場合や、隙間時間に上映をする場合も多くあります。

映画館で見たいけれど、平日昼しかやっていない。土曜の夜しかいけない・・・という場合は、土曜の夜の上映を希望する旨をぜひかいてみてください。
好きな映画はなるべく映像が良くて音響がいいシアターで見たいので、そのシアターをいずれ割り当ててくれないかと、自分は伝えています。

ひとりの意見なんて迷惑かもしれない、と考えるかもしれません。ですが、映画に関しては、今までやっていなかった時間にやってくれる！この時間なら見られる！という方がいると思います。

需要がある、ということを直接伝えることは、かなり影響があることです。

まとめ

ご要望を送る際にためらいがちですが、最終的な判断をするのは受取った側です。
なので、あまり気にせずにきもちを伝えたいということを中心に考えた方がいいでしょう。

また、良かった点に関しても、問い合わせの処理の負担にしたくはないため、読んでくれさえすればいい、お返事はどちらでも構わないことを必ず書いています。

自分が元気になりたいときに、お礼のメールを繰り返し見たり、またあらたに良かったお店にきもちを伝えたりしています。
実際、クレームを受け取ることはあっても、良かった点を声として受け取ることは少ないようです。

開発として自分が携わっているらくらくーぽんでも、お客様からいただいたご要望を実装しています。
どんな機能があればもっと使っていただけるだろうか、と話し合いますが、こういった機能があるとうれしいというお声があると、具体的に想像ができます。

また、サポート業務をしていた時に、お礼としていただいたメッセージを今もたまに見て、仕事のモチベーションアップにつなげています。
弊社システムを使ってくれるお客様がいると実感しやすく、よりよいものをはやく皆さんに届けられるように頑張っています。

送ったことが、読んでくれた方へのモチベーションアップにもつながれば嬉しいですね。
ぜひ、何か小さなことでも、満足したらその気持ちをお店に伝えてみてください！

CSSを設計するときに、特定の子要素を持つ親要素のみスタイルを当てたい場合どうしていましたか？例えば、画像を持つカードと画像を持たないカードでデザインを切り分けたい場合です。

一般的な対応は「jQueryの:has()を利用して親要素にクラスを付与する」でしょうか。
もしくは、「HTMLに出力する時点でクラスを付与できるように工夫し、複数パターンのスタイルを用意する」でしょうか。

どのような対応でも一手間かかったものが、CSS擬似クラスだけで実現できるようになりました。

私は首を長くして待っていたこの機能をご紹介します。

:has擬似クラスの使い方

基本的な使い方は擬似クラスと同じになります。

.card:has(img) {
  /* img要素を持つ.cardのスタイルを記述します */
}

特定の要素（クラスなども指定可能）を持つ親要素にスタイルを実装する機能です。
記述はシンプルですが、CSSだけで完結できるところに大きな価値があります。

:not()擬似クラスと組み合わせることもできます（あまり実用的ではないと思います）。

.card.not(:has(img)) {
  /* img要素を持たない.cardのスタイルを記述します */
}

冒頭で例に出した、カードの画像を持つ持たないでスタイルを切り替えるデモを用意しました。

デモのHTMLを確認するとわかりますが、画像の有無によってHTMLにクラスを付与などは行なっておりません。

単純な記述ですが、CSSでロジックを扱えるようになりました。
これまでの対応と比べると、コストが大幅に下がりますね。

2022年9月時点でのブラウザ対応状況

Chrome、Edgeは105（2022年9月時点での最新版）であれば対応していますね。
Safari（iOS含む）は 15.4以上であれば対応済み。
しかしFirefoxが対応していませんね、今のところ今後の対応予定もなさそうです。

現場で使う場合は注意が必要です。
いますぐ使いたい場合はポリフィルを使いましょう。

もしくはCSSの@supportsルールで切り分けましょう。

@supports selector(:has(*)) {
    /* :has対応ブラウザならばこの中のスタイルを適応します。 */
}

jQueryの:hasを使用している環境下では注意が必要

jQueryで:has()を用いていると、挙動がおかしくなることが報告されているようです。
単純にjQueryの:has()を使っているからダメというわけではなく、特定の条件下で起きるようです。

ブラウザ、CSS、jQueryそれぞれで対応しなきゃね、と話されているようですが、対応の具体的な予定はまだ出ていない模様です（2022年9月現在）。

まとめ

CSS界隈では渇望されていた機能がついに使える！と盛り上がっていたのですが、現時点で安易に使うのはやめた方がよさそうです。

テストコードを書いた感想としては、同じ機能を実装するコストがすごく下がったことを実感できたので、ぜひ現場でも使いたいと思いました。

CSSは力技でもなんとかなることが多いですが、知っていれば実装コストを下げられる機能があることを知ってもらいたくて紹介しました。

:has()に関しては、また続報があれば紹介するかもしれません。

弊社が提供しているあるお客様のシステムがかなりの年数経過をしており、またインフラ周りも古くなってきているので、リプレイスの提案を行うことにしました。

いざ何の言語で作ろう？となったときに思い浮かぶのは今まで扱ったことのある言語やフレームワークを踏襲するのが一番早いです。

ですが、弊社は新しいトレンドはどんどん取り入れていこう！という方針ですので、この機会に最新や流行の新しい形を取り入れたいと考えています。

では今現在（2022年11月）のトレンドは？ということで調べてみました。

検索数から見るランキング

アメリカのRedMonk社が、2022年第3四半期のプログラミング言語ランキングを発表しています。

このランキングはプロジェクトホスティングサイト「GitHub」の利用状況と、開発者向けQ＆Aサイト「Stack Overflow」で話題になった件数を調査した結果を基に作成されているそうです。

「Stack Overflow」は行き詰まってgoogleさんで検索すると、いつも検索結果に出てくるのでお世話になっていますｗ

今四半期の推移のストーリーは、これまでの数回の推移と同様に、安定性です。すぐに説明するいくつかの注目すべき例外を除けば、近年の言語運動のルールは、ほとんど運動がないということです。実際、ここにある 20 の言語のうち 17 は、3 四半期連続で安定しています。

https://redmonk.com/sogrady/2022/10/20/language-rankings-6-22/

考察にもあるように以前からある言語が上位を占めています。

自分的には11位以下にわりと新しめのものが入っていますが、世の中的にはそうではないのかもしれません。

Pythonが1位だと思っていたのですがね。JavaScriptだとは...

またPHPがこんなに上にあるとは思いませんでした。

開発者数から見るランキング

もう一つ、TIOBE Softwareが月次で発表する人気プログラミング言語ランキング「TIOBE Index」というものもあります。

プログラミング言語を使用する開発者数、コース数、サードパーティベンダー数、GoogleやWikipediaなどよく使われる検索エンジンの数値から、言語の人気度を割り出した月間のランキングです。

下記は最新の2022年11月発表のものです。

TIOBE Programming Community Indexの上位にランクインしているプログラミング言語は長期的に見るとそれほど変動していない。TIOBE SoftwareはこれまでKotlin、Dart、Juliaなどのプログラミング言語がトップ20位に常時ランクインする可能性は指摘してきたが、依然としてそれは実現していない状況にある。

こうした状況に対し、TIOBE Softwareは、Rustがそのポジションを確保するかもしれないとの見解を示した。Rustは2022年10月にトップ20に入り、そして2022年11月もトップ20に入っている。Rustは実行速度が高速であるにもかかわらず安全であるというという相反しやすい性能が備わっており、TIOBE Softwareはその特徴を「ユニーク」だと評価している。

https://news.mynavi.jp/techplus/article/20221110-2508215/

こちらは予想通りのPython1位でした。

シェアも伸びているようで17%はスゴイですね。Pythonが使われいない分野はなくなっているような状況になってきているのかもしれません。

2つのランキングから見えたトレンドは、どちらのランキングを見ても上位は変動しない安定期に入っているようです。

それでも上位の中ではPythonが伸びて、PHPが下落しているようです。

MATLAB？

私が知らない言語が入っていました。

どうやら分析やディープラーニングで使う言語のようです。

MATLAB（マットラブまたはマトラボ）は、アメリカ合衆国のMathWorks社が開発している数値解析ソフトウェアであり、その中で使うプログラミング言語の名称でもある。MATLABは、数値線形代数、関数とデータの可視化、アルゴリズム開発、グラフィカルインターフェイスや、他言語(C言語/C++/Java/Python)とのインターフェイスの機能を有している。MATLABは、主に、数値計算を扱う事ができるが、追加のオプションSymbolic Math Toolboxを使うことで、数式処理の能力を得ることができる。2019年時点でMATLABのユーザー数は400万人を超えており、100,000 以上の企業・政府・大学で、工学・理学・経済学など幅広い分野に利用されている。

https://ja.wikipedia.org/wiki/MATLAB

2つのランキングから見えたトレンド

どちらの結果を見ても安定期、変動していない、という文言から、直近では新しいものが一気に広がるということはないようです。

Java、Python、C、PHP

このあたりには一日の長があるということになりそうです。

その中でも検索数からは2位、利用者数では1位の

Python

機械学習や人工知能、AIといったところではまず名前が上がってきますからね。

今さらながらPythonとはどんな言語なんでしょう。

Pythonとは1991年にオランダ人のグイド・ヴァンロッサムというプログラマーによって開発され、オープンソースで運営されているプログラミング言語です。イギリスBBCのコメディ番組『空飛ぶモンティ・パイソン』がPythonという名前の由来であるようです。一括りにPythonといってもその用途は様々で、組み込み開発や、Webアプリケーション、デスクトップアプリケーション、さらには人工知能開発、ビッグデータ解析などと多岐に渡ります。

Pythonのプログラミング言語としての主な特徴は、少ないコードで簡潔にプログラムを書けること、専門的なライブラリが豊富にあることなどが挙げられます。

https://www.internetacademy.jp/it/programming/programming-basic/what-is-python.html

敷居も低い印象ですし、また読みやすさ、書きやすさを重視された言語ですよね。

私も勉強がてら触ったことはありますが、業務で導入したことはないですね。

また少し前に良く聞いた「Rust」や「Swift」「Kotlin」は伸びていないですね。

「Rsut」は

Rust（ラスト）は、性能、メモリ安全性、安全な並行性を目指して設計されたマルチパラダイムのプログラミング言語である。C言語、C++に代わるシステムプログラミング言語を目指しており[2]、構文的にはC++に似ているが[3]、「ボローチェッカー」(borrow checker) で参照の有効性を検証することによってメモリ安全性を保証できる。Rustはガベージコレクションなしでのメモリ安全性を達成しており、必要な場面で参照カウントを使うこともできる

https://ja.wikipedia.org/wiki/Rust_(%E3%83%97%E3%83%AD%E3%82%B0%E3%83%A9%E3%83%9F%E3%83%B3%E3%82%B0%E8%A8%80%E8%AA%9E)

「Swift」は

Swift（スウィフト）は、AppleのiOSおよびmacOS、Linux、Windowsで利用出来るプログラミング言語である。Worldwide Developers Conference (WWDC) 2014で発表された。Apple製OS上で動作するアプリケーションの開発に従来から用いられていたObjective-CやObjective-C++、C言語と共存できるように、共通のObjective-Cランタイムライブラリが使用されている。

https://ja.wikipedia.org/wiki/Swift_(%E3%83%97%E3%83%AD%E3%82%B0%E3%83%A9%E3%83%9F%E3%83%B3%E3%82%B0%E8%A8%80%E8%AA%9E)

「Kotlin」とは

Kotlinとは、Androidアプリを開発するための代表的なプログラミング言語です。Kotlinは2011年に登場したばかりの言語で、Kotlinが登場するまで、Androidアプリを開発するにはJavaが使用されていました。そのJavaを改良して、開発された言語がKotlinです。

https://hnavi.co.jp/knowledge/blog/kotlin-development/

フロント側ではJavascriptからtypescriptへ、その中でもReactJSやVewJSなどのライブらりやフレームワークを使ってのSAPになるでしょうか。

新しい言語の選択

上でも述べたように結局はフレームワーク次第ということもあります。

JavaのSpring FrameworkやRubyのRuby on Rails、PHPのLaravel

このあたりは鉄板ですかね。

で私が取り組もうとしているのは

Go言語を学んでみたい。

ですね。

何年か前にも話題となっていましたが、イマイチ伸びていないですよね。

でも弊社のメインであるWeb開発やアプリ開発でも利用できるので、まだまだ将来性があるのではないでしょうか。

Go言語のフレームワークとなれば

Echo

でしょうかね。

正直、年を取って覚えることにおっくうになってしまいがちですが、チャレンジ精神はいつまでも持ち続けたいと思います。

頑張れ自分！

はじめまして。
中途採用で入社致しました、白久(しろく)と申します。

グリニッジで提供しているサービス内容と
会社の雰囲気に惹かれ、入社致しました。
業界未経験での入社ということで
知識が浅く、今はできることはそう多くはないですが、
こつこつと知識や経験を増やしていき、
社内外問わずグリニッジに関わる皆さんのお力になりたいです。

好きなことはコントを見ること、おやじギャグ、沖縄(特に地元名護市)、
食べ飲み歩き、お散歩、カラオケ、映画鑑賞、料理…などです。
趣味は？と聞かれると１つに絞れず、いつも答えが違ってしまう人です。
人生100年では足りないな、と常々思っております。

コントは有吉の壁やテレビ千鳥を見始めたことがきっかけで、
よく見るようになりました。
好きな芸人さんは、
　・千鳥大悟さん
　・なかやまきんに君さん
　・ジョイマン高木さん
　・シソンヌじろうさん
です。
誰も傷つけないお笑いが好きです。

そして先日は初のお笑いライブに参戦しました！
高木さんのあのジャンプを目の当たりし、会場はどよめきが起きました。
あれは跳んでいたというより、完全に飛んでましたね。
じろうさんの演技力も脱帽ものでした。

また、最近は”LE SSERAFIM”という韓国の女性5人組アイドルグループに夢中です。

今までアイドルにはハマったことがなく、
好きな女性芸能人は15年以上本田翼さん一筋だったので自分でも驚いております。

LE SSERAFIMというグループ名は下記のような意味が込められているそうです。

グループ名の「LE SSERAFIM」は「IM FEARLESS」のアナグラムにより作られた。 「IM FEARLESS」が意味するように、世の中の視線に揺らぐことなく恐れずに前に進むという自己確信と強い意志が込められている。

https://sourcemusic.com/artist/profile/LE%20SSERAFIM

※ちなみに、「I'M FEARLESS」とは、「私は恐れを知らない」という意味です。

もともと周りを気にしてしまうタイプでしたが、
LE SSERAFIMを知ってからは
彼女たちの楽曲を聴き、活動する姿を見て、
日々励まされ、以前よりは強気に過ごしております。(白久比べ)

と、長くなりましたが…、
お笑い芸人さんたちから元気を、
LE SSERAFIMから勇気を、
本田翼さんから癒しを、
グリニッジの先輩方から知識を、
それぞれ享受しながら、私らしく頑張る所存です！
これからよろしくお願いします！

コロナ禍でテレワークを導入している企業が以前よりも増えたからか、「連絡は電話ではなくメールでお願いします。」と希望される方が多くなったような気がします。
また、弊社でもテレワークを導入しているので、社内のやり取りは主にチャットを使い、社内・社外どちらの場面でも「話す」よりも「書く」割合が多くなりました。

相手が不在の時でも、文章を送っておけば後で確認してもらえるのでラクなのですが、機械的な冷たい印象の文章になってしまうことで、こちらの気持ちが相手にうまく伝わらなかったり、誤字・脱字や失礼な文章になっていないか念入りに確認する作業が増えるため、話す時よりもやり取りに時間がかかってしまいます。
社内で同僚や部下に間違いを指摘しなければならない時、口頭で伝える場合には表情や言い方次第で相手の気分を害さないで終えられるのに、文章だとお互いの表情が見えない分、「キツイ言い方だな」「冷たい人」「すごく怒っている」などと、ネガティブな印象を持たれてしまうかもしれません。

社内・社外でも良い人間関係を築いていくため、また仕事の効率化のためにも、文章を相手に上手に伝えられるというのはとても重要なことなのではないかと、最近、強く感じるようになりました。
そこで、中村圭著『メールで失礼な人にならない方法』という書籍を参考に、上手な文章を伝えるポイントを仕事で実践してみましたので、感じたことをお伝えしたいと思います。

実践したこと

▼その書き方、ポジティブに変換できない？～お願いは、「ポジティブ」に伝えるのが正解～

“たとえば、デザイナーにデザインの修正をお願いするときに、「文字が大きすぎると思います。修正してください。」と言うと、ネガティブです。
「文字がもう少し小さくなると、さらに良くなると思いますが、どうでしょうか？」こんなふうに反対側から書くだけで、ポジティブな書き方に変換できます。
ネガティブな表現は相手に対してダメージを蓄積させイラっとさせます。
逆にポジティブを積み重ねれば、印象は良くなっていくのです。”

中村圭著『メールで失礼な人にならない方法』

今まで相手のモチベーションを下げるような一方的なお願いをしてしまっていたかもしれないと、この文章を読んだ時にドキッとしました。
自分がデザイナーの立場で、こんなふうにお願いをされたらイラっとするかもしれませんね…

伝えたい内容は同じでも、ネガティブをポジティブに文章の書き方を変えてみると、こんなにも受け取る側の印象が変わるのかと驚きです。
このポイントを参考に、お願いする時はポジティブな文章になるように意識してみたところ、確かに、相手からも印象の良い返信が返ってくることが多くなったような気がします。

▼狙うは、一発で返せるボール～優秀な人は「連絡の回数」を少なく済ませる～

“やり取りする量を減らせれば、自分の時間が増えます。
そして増えた時間で、評価につながる仕事をすればさらに評価が上がります。
メッセージの印象的にも、全体の生産性を上げることでも、やり取りを少なくすることは、評価を上げることにつながるのです。”

中村圭著『メールで失礼な人にならない方法』

メールのやり取りが長く続いてしまっている時、「さっきのメールで聞いてくれたら1回でやり取りを終わらせられたのに…」と思うことがあります。
打ち合わせの日程がなんとか無事に決まったとしても、その日程を決めるまでのやり取りに時間がかかってしまうことで、当日に必要な資料を作成する時間が短くなってしまったり、すでに決まっていた他のスケジュールを別の日に調整したりと、いろいろと面倒なことが発生します。

私は、打ち合わせの日程を決めるメールの際には、あらかじめこちらから候補日をいくつかあげたり、逆に都合の悪い日程を書いておくなど、できる限り1回でやり取りを済ませられるように文章を書くようにしました。
今までは、「あっ、またこの人からメールが来ている。さっき返信したばかりなのに、今度はなんだろう…」とモヤモヤすることがありましたが、連絡の回数を減らすよう文章に工夫することで、メールの受信を気にすることなく、仕事に集中できるようになったと思います。

他に実践してみたこと…

▼会話文で感情をリアルに～自分で言わずに、「第三者」に言ってもらおう～
▼相手の感情に、返信する～「相手の感情ワード」をスルーしてはいけない！～
▼単語の二重人格に、ご注意を～よくわからない「小難しい単語」を使ってはいけない～
▼読みたいかは、見た目で決まる～返事がもらえないのは、「文章が長すぎる」から～

みなさんも、「あ～、これ自分もやってしまっていたなぁ。」と思い当たるものがあるかもしれません…
気になる方はチェックしてみてください。

さいごに

今回いろいろ実践してみましたが、相手に文章を上手に伝えられるようになると、お互いが気持ちよく仕事ができますし、自分の時間も確保できるようになるので、仕事の効率も上がると実感しました。

しかし、やはり文章を書くというのは難しいですね…
上手な文章を書くのにアレコレ考え過ぎて、まだまだ時間がかかってしまう部分はありますが、「スマートなやり取りができる人」と周りから評価してもらえる、そんな文章を書ける人間になっていけたら良いなと思います！