自由な操作性がたのしい!「Salon.io」でポートフォリオサイトを作ってみた
こんにちは!いまい(@Imai_design)です。
早くも8月が後半に差し掛かってきましたね…
私は引き続きフリーランス転身へ向けて準備を進めています。
最近具体的に何をしていたのかといいますと
●ウェブデザインの勉強
オンラインスクールで勉強中です
●さくっと名刺つくったり、ポートフォリオサイト作ったり
していました。
●情報収集(フリーランスで活躍している方のブログ読んだり、新聞読んだり)
これは言わずもがなですが…
ウェブデザインオンラインスクールに関しては
勉強を初めてからそろそろ1か月ほど経ちます。
毎度コーディングが難しすぎて毎度苦しみながら勉強してますが
ようやく「コーディング楽しい!(滅茶苦茶難しいけど!)」というところに
たどりつき始めたところです。スクールレビューを含め今度詳しく書きますね!
本日はポートフォリオサイトを作るのに利用した
「Salon.io」というサービスをご紹介します。
Salon.io
●Salon.ioの特徴
・コードの知識不要 Salon.ioを使えば、誰でも簡単に美しいWebサイトを作ることができます。
・誰でも簡単に 画像やテキストをドラッグするだけで、どこでも好きな位置に配置できます。
・簡単に組み込みテキストボックスを作って組み込みコード (Youtube、Vimeo、Soundcloudなど)を貼付ければ自動的に表示されます。
・HTML & CSSの追加 コードエディターでHTMLやCSSを追加し、サイトをカスタマイズしましょう。
・広告表示一切なし現在、そして今後もSalon.ioは広告フリーで有り続けます。無料アカウントにも広告は一切表示しません。(salon.io「salon.ioについて」ページより引用)
無料ポートフォリオサービスは沢山あるので色々迷ったのですが
「画像をドラッグ&ドロップで配置」できるのが簡単そう~!と思ったので
こちらのサービスを利用してみました。
●フリーグリッドで自由に画像を動かせるのが楽しい!
ご覧の通り、改行やスペースボタンを延々と押さずとも
画面の中に自由に画像配置を行うことが出来るんですね。これはたのしい!
真っ白なカンバスに自分の作品をドラックアンドドロップしておいていきます。
グリッド表示の編集画面。画像をマウスでドラックすれば自由に動かせます
グリッド非表示にしてみました
(ただし、スマートフォンで閲覧した時のレスポンシブ表示では
レイアウトが激しく崩れてしまうようなのでご注意ください!
PCで見てもらうの前提なのでしょうか?楽しい機能なだけに歯がゆいです…)
●レイアウトに迷ったときに頼れそうな
ほどよいサポートツールつき
・自動生成ツール
・ランダムレイアウト自動生成ツール
ドロップした画像を自動で並べてくれたり、ランダムな大きさに切り出してくれる
サポート機能も付いています。
これはうまく使いこなせればカッコイイ雰囲気の
ポートフォリオサイトが作れるんだろうな~!
右部分にあるメニューウィンドウの数値を調整して効果を確定させると
こんな感じでランダムに並べてくれます。
画像の最小サイズ・最大サイズや画像の間の余白サイズも設定可能。
画像にばらつきがあるのでデコボコしてしまってます。
画像サイズは均一にしておいた方がより洗練された雰囲気にしれくれそうですね。
写真作品とかやってる方はいいかもしれない…!?と個人的に感じました。
無料で使用できるポートフォリオサイトは(とてもありがたいことに)
沢山のサービスが展開されていますが
とにかく説明サイトを見てみて「このサービスは自分の感性に合いそうだ!」と
直感が来たら登録してみるのが一番いいのでは!?と思ってます。
ポートフォリオサイト=仕事のツールではありますけど
自分の感性に合ったツールを使うのが健康的でいいですよね。
作業をしていてもテンション上がりますし…
「カッコイイポートフォリオを作るサイト」というより
「自分のオリジナリティを重視したデザインにしたい!」という人は
この「Salon.io」が相性がよさそうです!
※いまいのポートフォリオサイトができました
私のポートフォリオサイトです※随時更新
ポチポチ更新していきますので、よろしければのぞいてやってください。