tag:crieit.net,2005:https://crieit.net/tags/2019%E6%8C%AF%E3%82%8A%E8%BF%94%E3%82%8A/feed Crieitでタグ「2019振り返り」に投稿された最近の記事 2019-12-31T13:33:23+09:00 https://crieit.net/tags/2019%E6%8C%AF%E3%82%8A%E8%BF%94%E3%82%8A/feed tag:crieit.net,2005:PublicArticle/15660 2019-12-31T13:33:23+09:00 2019-12-31T13:33:23+09:00 https://crieit.net/posts/2019-UI <p><a href="https://crieit.now.sh/upload_images/3cebc8b53a7a1a70fcf9eb56cb0dfce15dd018433068a.jpg" target="_blank" rel="nofollow noopener"><img src="https://crieit.now.sh/upload_images/3cebc8b53a7a1a70fcf9eb56cb0dfce15dd018433068a.jpg?mw=700" alt="" /></a><br /> 2019年、色々なものを作ったので少しずつ振り返ろうと思います。</p> <h1 id="経緯"><a href="#%E7%B5%8C%E7%B7%AF">経緯</a></h1> <p>元々、業務系のサーバサイドのプログラムを得意としていたのもあって、WEBサービスのUIは全く無関心というかCSSの中身もよくわからない状態でした。</p> <h1 id="作ったものを振り返る"><a href="#%E4%BD%9C%E3%81%A3%E3%81%9F%E3%82%82%E3%81%AE%E3%82%92%E6%8C%AF%E3%82%8A%E8%BF%94%E3%82%8B">作ったものを振り返る</a></h1> <p>画像多めですが、駆け足で振り返ります。<br /> UIに目覚めたのは8月のぐらいでしょうか。<br /> 10月後半からは怒涛の毎週リリース(毎週末何か作っては発表)をしていました。</p> <h2 id="1/4 slack流量計"><a href="#1%2F4+slack%E6%B5%81%E9%87%8F%E8%A8%88">1/4 slack流量計</a></h2> <p><a href="https://crieit.now.sh/upload_images/7a7957261387b24d52e646e155b1c2b15c30957b80170.png" target="_blank" rel="nofollow noopener"><img src="https://crieit.now.sh/upload_images/7a7957261387b24d52e646e155b1c2b15c30957b80170.png?mw=700" alt="" /></a><br /> <a href="https://crieit.net/posts/slack">slack流量計の新バージョンをリリースしました</a><br /> 運営者ギルドで使っているslackの投稿数を可視化するツールです。<br /> あぁ、これまだ2019年でしたか....。</p> <h2 id="2月-6月"><a href="#2%E6%9C%88-6%E6%9C%88">2月-6月</a></h2> <h3 id="2月"><a href="#2%E6%9C%88">2月</a></h3> <p><a href="https://crieit.now.sh/upload_images/b08b548caec5795ad40e35af9c85f4c95c77f39d0e632.png" target="_blank" rel="nofollow noopener"><img src="https://crieit.now.sh/upload_images/b08b548caec5795ad40e35af9c85f4c95c77f39d0e632.png?mw=700" alt="" /></a><br /> 2月末。試行錯誤していますが、振り返ると首を傾げたくなるデザイン...。</p> <h3 id="4月"><a href="#4%E6%9C%88">4月</a></h3> <p><a href="https://crieit.now.sh/upload_images/c757f121bd19245f1a30d36c3424b0625cc659b1e56d5.jpg" target="_blank" rel="nofollow noopener"><img src="https://crieit.now.sh/upload_images/c757f121bd19245f1a30d36c3424b0625cc659b1e56d5.jpg?mw=700" alt="" /></a><br /> 今の野球成績管理システムはこのあたりでfixした模様。</p> <h3 id="5-6月"><a href="#5-6%E6%9C%88">5-6月</a></h3> <p>このあたりから野球スコア管理システムのver3を製造開始。</p> <h2 id="8/18 タイピングスコア管理システム"><a href="#8%2F18+%E3%82%BF%E3%82%A4%E3%83%94%E3%83%B3%E3%82%B0%E3%82%B9%E3%82%B3%E3%82%A2%E7%AE%A1%E7%90%86%E3%82%B7%E3%82%B9%E3%83%86%E3%83%A0">8/18 タイピングスコア管理システム</a></h2> <p><a href="https://crieit.now.sh/upload_images/c6a4b4840dc7b0443a48a1205e7fb4455d593c36cd7a1.png" target="_blank" rel="nofollow noopener"><img src="https://crieit.now.sh/upload_images/c6a4b4840dc7b0443a48a1205e7fb4455d593c36cd7a1.png?mw=700" alt="" /></a></p> <p><a href="https://crieit.net/posts/cb42a72a9e70af9ea472af216219e0e8">タイピングスコア管理システムを作った</a></p> <p>社内向けのタイピング練習システム。このあたりから若干UI凝り始めた。</p> <h2 id="8/21 キャップ全国大会非公式サイト"><a href="#8%2F21+%E3%82%AD%E3%83%A3%E3%83%83%E3%83%97%E5%85%A8%E5%9B%BD%E5%A4%A7%E4%BC%9A%E9%9D%9E%E5%85%AC%E5%BC%8F%E3%82%B5%E3%82%A4%E3%83%88">8/21 キャップ全国大会非公式サイト</a></h2> <p><a href="https://crieit.now.sh/upload_images/b0f24117575660588f657c26c91d370e5d5d2ca647db2.png" target="_blank" rel="nofollow noopener"><img src="https://crieit.now.sh/upload_images/b0f24117575660588f657c26c91d370e5d5d2ca647db2.png?mw=700" alt="" /></a><br /> <a href="https://crieit.net/boards/baseball-score-management/f51b909e24c84342ac946117b65d092e">キャップ野球全国大会の非公式特設サイトを作った</a></p> <p>このサイトが事実上の転機になりました。<br /> 自分でUIを作るのに試行錯誤してCSS書きまくって...桜吹雪まで飛ばしてます。このあたりからUIの大切さとかUIへのこだわりとかが生まれた気がします。</p> <h2 id="9/9 CSSでtrans-am"><a href="#9%2F9+CSS%E3%81%A7trans-am">9/9 CSSでtrans-am</a></h2> <p><a href="https://crieit.now.sh/upload_images/b08b548caec5795ad40e35af9c85f4c95d764f1a11e8a.png" target="_blank" rel="nofollow noopener"><img src="https://crieit.now.sh/upload_images/b08b548caec5795ad40e35af9c85f4c95d764f1a11e8a.png?mw=700" alt="" /></a><br /> <a href="https://crieit.net/posts/CSS">CSSアニメーションでトランザム！</a><br /> CSSアニメーションの作り方が何となくわかった回。</p> <h2 id="10/6 野球スコア管理システムver3"><a href="#10%2F6+%E9%87%8E%E7%90%83%E3%82%B9%E3%82%B3%E3%82%A2%E7%AE%A1%E7%90%86%E3%82%B7%E3%82%B9%E3%83%86%E3%83%A0ver3">10/6 野球スコア管理システムver3</a></h2> <p><a href="https://crieit.now.sh/upload_images/b08b548caec5795ad40e35af9c85f4c95dac57eabfff8.png" target="_blank" rel="nofollow noopener"><img src="https://crieit.now.sh/upload_images/b08b548caec5795ad40e35af9c85f4c95dac57eabfff8.png?mw=700" alt="" /></a><br /> <a href="https://crieit.net/boards/baseball-score-management/10-6"></a></p> <h2 id="10/21 ドラフトなう！"><a href="#10%2F21+%E3%83%89%E3%83%A9%E3%83%95%E3%83%88%E3%81%AA%E3%81%86%EF%BC%81">10/21 ドラフトなう！</a></h2> <p><a href="https://crieit.now.sh/upload_images/c92cd6ef54296b6dfb31726f0b708d715dacf6b4b06a6.png" target="_blank" rel="nofollow noopener"><img src="https://crieit.now.sh/upload_images/c92cd6ef54296b6dfb31726f0b708d715dacf6b4b06a6.png?mw=700" alt="" /></a><br /> <a href="https://crieit.net/posts/4b0c9a1ddc05a0cc0ff61db75530b9b0">ドラフト風画像作成サービス「ドラフトなう！」を作りました</a></p> <p>ドラフト会議に間に合わなかったやつですね！</p> <h2 id="10/27 アニメランキング作成サービス"><a href="#10%2F27+%E3%82%A2%E3%83%8B%E3%83%A1%E3%83%A9%E3%83%B3%E3%82%AD%E3%83%B3%E3%82%B0%E4%BD%9C%E6%88%90%E3%82%B5%E3%83%BC%E3%83%93%E3%82%B9">10/27 アニメランキング作成サービス</a></h2> <p><a href="https://crieit.now.sh/upload_images/f2fa429ca90221dc87d712c2a35832965db586d228738.jpg" target="_blank" rel="nofollow noopener"><img src="https://crieit.now.sh/upload_images/f2fa429ca90221dc87d712c2a35832965db586d228738.jpg?mw=700" alt="" /></a><br /> <a href="https://crieit.net/posts/AnnictAccess3">アニメランキング作成サービスをリニューアルしました</a></p> <h2 id="11/17 音楽ランキングメーカー"><a href="#11%2F17+%E9%9F%B3%E6%A5%BD%E3%83%A9%E3%83%B3%E3%82%AD%E3%83%B3%E3%82%B0%E3%83%A1%E3%83%BC%E3%82%AB%E3%83%BC">11/17 音楽ランキングメーカー</a></h2> <p><a href="https://crieit.now.sh/upload_images/3cebc8b53a7a1a70fcf9eb56cb0dfce15dd018433068a.jpg" target="_blank" rel="nofollow noopener"><img src="https://crieit.now.sh/upload_images/3cebc8b53a7a1a70fcf9eb56cb0dfce15dd018433068a.jpg?mw=700" alt="" /></a><br /> <a href="https://crieit.net/posts/509e31a0bbc4ffe7a1003278816c9e5d">音楽ランキングメーカーをリリースしました</a></p> <p>Reactのドラッグアンドドロップが気に入ったのもあってUIを流用して別カテゴリでサービスを作ってみた。</p> <h2 id="12/1 優勝ラインシミュレータ"><a href="#12%2F1+%E5%84%AA%E5%8B%9D%E3%83%A9%E3%82%A4%E3%83%B3%E3%82%B7%E3%83%9F%E3%83%A5%E3%83%AC%E3%83%BC%E3%82%BF">12/1 優勝ラインシミュレータ</a></h2> <p><a href="https://crieit.now.sh/upload_images/814e7c46897c4976a9690900999ccc1a5de3a91f485a7.jpg" target="_blank" rel="nofollow noopener"><img src="https://crieit.now.sh/upload_images/814e7c46897c4976a9690900999ccc1a5de3a91f485a7.jpg?mw=700" alt="" /></a><br /> <a href="https://crieit.net/boards/baseball-score-management/d3a03b2eecede278f5eb211aaff9a6a2">優勝ラインシミュレーター作りました</a><br /> これはクソ(UI)アプリ。ちょっとしたいきさつがあってクソアプリアドベントカレンダーに載りました。</p> <h2 id="12/2 ボウリング幹事アプリ"><a href="#12%2F2+%E3%83%9C%E3%82%A6%E3%83%AA%E3%83%B3%E3%82%B0%E5%B9%B9%E4%BA%8B%E3%82%A2%E3%83%97%E3%83%AA">12/2 ボウリング幹事アプリ</a></h2> <p><a href="https://crieit.now.sh/upload_images/3cebc8b53a7a1a70fcf9eb56cb0dfce15dda909adf110.jpg" target="_blank" rel="nofollow noopener"><img src="https://crieit.now.sh/upload_images/3cebc8b53a7a1a70fcf9eb56cb0dfce15dda909adf110.jpg?mw=700" alt="" /></a><br /> <a href="https://crieit.net/posts/d2e5218181c66086dd0e423f1bc427a9">ボウリング幹事アプリ</a><br /> MQTTを使った表示画面同期を実装しました。</p> <h2 id="12/8 イベントカレンダー「ふたびより」"><a href="#12%2F8+%E3%82%A4%E3%83%99%E3%83%B3%E3%83%88%E3%82%AB%E3%83%AC%E3%83%B3%E3%83%80%E3%83%BC%E3%80%8C%E3%81%B5%E3%81%9F%E3%81%B3%E3%82%88%E3%82%8A%E3%80%8D">12/8 イベントカレンダー「ふたびより」</a></h2> <p><a href="https://crieit.now.sh/upload_images/3cebc8b53a7a1a70fcf9eb56cb0dfce15debc00300520.jpg" target="_blank" rel="nofollow noopener"><img src="https://crieit.now.sh/upload_images/3cebc8b53a7a1a70fcf9eb56cb0dfce15debc00300520.jpg?mw=700" alt="" /></a><br /> <a href="https://crieit.net/posts/582e915854052994bfba960a9f0f66a4">イベントカレンダー「ふたびより」</a></p> <h2 id="12/11 キャップ野球チームページ作成(wix)"><a href="#12%2F11+%E3%82%AD%E3%83%A3%E3%83%83%E3%83%97%E9%87%8E%E7%90%83%E3%83%81%E3%83%BC%E3%83%A0%E3%83%9A%E3%83%BC%E3%82%B8%E4%BD%9C%E6%88%90%28wix%29">12/11 キャップ野球チームページ作成(wix)</a></h2> <p><img src="https://static.wixstatic.com/media/a067ea_232509a818894a5bb8634b0cf45df201~mv2_d_2024_1262_s_2.jpg/v1/fit/w_2500,h_1330,al_c/a067ea_232509a818894a5bb8634b0cf45df201~mv2_d_2024_1262_s_2.jpg" alt="" /><br /> <a target="_blank" rel="nofollow noopener" href="https://ckoshien1.wixsite.com/ts-cappers">東京世田谷キャッパーズ</a></p> <h2 id="12/14 キャップ野球情報局"><a href="#12%2F14+%E3%82%AD%E3%83%A3%E3%83%83%E3%83%97%E9%87%8E%E7%90%83%E6%83%85%E5%A0%B1%E5%B1%80">12/14 キャップ野球情報局</a></h2> <p><a href="https://crieit.now.sh/upload_images/3cebc8b53a7a1a70fcf9eb56cb0dfce15df4fa5e69108.jpg" target="_blank" rel="nofollow noopener"><img src="https://crieit.now.sh/upload_images/3cebc8b53a7a1a70fcf9eb56cb0dfce15df4fa5e69108.jpg?mw=700" alt="" /></a><br /> <a href="https://crieit.net/boards/baseball-score-management/CMS">CMS風サイトを作りました</a></p> ckoshien