アプリ・サービス

【Webアプリ】気づいた?『Shuffle Songs』地味な修正点!

基盤の上に「Shuffle Songs」とアイコンが描かれた画像

宣言通り、昨日から『4分鬼筋トレ』を開始した。

結果は、2週間後に報告するのでお楽しみに。

今日は、特定の歌手の曲をランダムに表示するWebアプリ、『Shuffle Songs』を少しだけ手直しした。地味すぎて気づかないであろう修正点をまとめていく。

【読書】最速で腹筋を割れ!『4分鬼筋トレ』でボディメイク!今注目の若手俳優がシャツをめくると、美しく割れた腹筋が映る。 そして、観覧席の女性達が黄色い声援を上げる、というTV番組で幾度か観た光...
Shuffle Songs のロゴ画像
【Shuffle Songs】プログラミングでランダムに選曲!2019年6月23日、「Shuffle Songs」というWebアプリケーションを公開した。 Shuffle Song...

『Shuffle Songs』背景色

Shuffle Songs背景色の修正前と修正後の比較画像

選曲した曲のタイトルが表示されるエリアの背景色に注目。

以前は単色だったが、修正後はグラデーションがかかっている。

黄緑色から白色へ向かっていくように、CSSで開始点から終了点に向けて色が変化する線形グラデーションを設定した。

CSS
修正前
background-color: #bcef82;
修正後
background: linear-gradient(#bcef82, #fff);


linear-gradient
で、開始色と終了色を指定。

上記の場合、#bcef82が開始色で、#fffが終了色。

ここでは省略しているが、グラデーションの方向や角度、途中色も指定できる。

『Shuffle Songs』ツイートボタン

Shuffle Songsのツイートボタンを押した時のスクリーンショット

Twitterのアイコンを押すと、選曲の結果をシェアすることができる。

修正前の内容

【Shuffle Songs】

今回の選曲は、”歌手名”「”曲名”」 “URL”

#ShuffleSongs #KHApp

修正後の内容

【Shuffle Songs】

今回の選曲は、”歌手名”『”曲名”』 “URL”

#”歌手名” #ShuffleSongs #KHApp #KHEditor

修正前は、曲名が「」で囲まれていたが、修正後は目立つように『』にした。

また、ハッシュタグは、#ShuffleSongs と #KHApp だけだったが、#歌手名 と #KHEditor(ブログ名)を追加した。

スイフー
スイフー
これ、絶対気づかないよね!
イフちゃん
イフちゃん
これぞまさに地味ですね。

メニューバー 内容修正

K.H.Appメニューバーの修正前と修正後の比較画像

K.H.App全体の修正だが、メニューバーにInstagramの項目が追加された。

また、NANA→nanaのように大文字を小文字へ。

さらにTwitterは、実名に変えたアカウントへ飛ぶように設定。YouTubeのリンクも『スイフーエディタチャンネル』のままだったので、『K.H.Editor』に変更した。APPの項目は、これから追加されるので、今しばらくお待ちを。

イフちゃん
イフちゃん
前に言っていた、”何か忘れているような不安”はこのことだったんですね。
スイフー
スイフー
そうそう!分かってスッキリしたよ……w
【Vlog】ラジオ?動画?Vlogもどきを投稿してみた!アイキャッチ
【Vlog】ラジオ?動画?Vlogもどきを投稿してみた!スイフーから日景健貴(実名)への改名に伴って、ブログのタイトルやSNSのアカウント名など、全てまとめて変更することとなった。 とこ...
▽スイフーの情報はこちらから▽
スイフー
スイフー
最後までご覧くださりありがとうございます!
イフちゃん
イフちゃん
フォローやチャンネル登録、お待ちしております!

COMMENT

メールアドレスが公開されることはありません。