太好看瞭!這款由設計師開發的微信小程序,讓你再也不用擔心被雨淋

原標題:太好看瞭!這款由設計師開發的微信小程序,讓你再也不用擔心被雨淋



羅曼羅蘭曾說過:

世上隻有一種真正的英雄主義,那就是認清生活的真相後,依然熱愛生活。

我熱愛生活,是個理想主義者,也是個射手座。我熱愛文學,卻學瞭設計,我熱愛設計,卻學瞭開發。我想,我所做的一切,隻是想更準確地表達自己。

感謝知曉程序(微信號 zxcx0101)給瞭我一次表述自己的機會。

台中商標註冊查詢

小天氣是什麼?

「小天氣」是我做的一個實時查詢天氣的小程序。

排版簡約精致,佈局條理分明。

它采用精準的天氣數據,提供分鐘級的降雨提醒、實時天氣、污染指數、48 小時逐時預報、五日預報、天氣預警,以及其它單項天氣信息。





為瞭讓更多人看見,我選擇瞭小程序

我很普通,自學瞭三年前端,踩瞭很多坑,也走瞭很多彎路,當然也獲得瞭更多的成就感。

我做 web 前端,瀏覽器即是載體,因為無法讓許多人打開瀏覽器,輸入網址訪問我的網站,所以我來到台中商標註冊瞭微信。

說到「小天氣」,也是因為一個很偶然的原因。

我的另一個移動 web 項目(文藝日簽類,類似 one 一個,一言等產品)需要實現一個功能,就是用 canvas 生成圖片時,加上地理位置與本地天氣。這使得我接觸到瞭天氣接口。

就此我找瞭許多天氣接口提供商。然而,免費的數據不全,且調用量有限制,而且質量不一,要麼少這個數據,要麼少那個數據。收費的更是參差不齊,好壞不一。

「小天氣」 1.0 版本采用的並不是現有的接口,而是采用的一傢數據較全,而且數據都是已處理好的數據。

可惜,看著不錯,調用方便,但是天氣不準。這,是硬傷。

所以,我在考察瞭很多數據的全面性和準確性後,更換瞭第二個版本的數據。API 市場提供的天氣 API 不適合做天氣小程序,更適用於日歷或外賣等平臺使用的簡單天氣狀況。

另外,我也找到瞭雅虎天氣的 API,但由於返回的數據英文偏多,所以放棄使用。在此之前,我是使用彩雲天氣的,相對來說彩雲天氣比較精準。而此次發現彩雲天氣也是提供天氣 API 的,最終決定選用彩雲天氣的 API。



相比第一版采用的 API,彩雲 API 提供的數據更加原始,這也增加瞭很多自定義數據加工的方式。

比如關於風,返回的數據為風向角與風速,根據官方文檔判斷風向,風力,以及可以自定義風的具像化;比如一級風,對應炊煙直上。

這使得一個產品可以利用自定義而更具特色,我的想法是一套簡約的文字,但是目前並沒準備好。

不會設計的前端,不是好的程序員

我做「小天氣」並沒想太多,比如要做成爆款之類。

我是一名設計師,所以 UI 必須得到位。我理解的到位即是簡約但精致,友好與實用,這也是「小天氣」整體的設計理念。



我的女朋友很少看天氣,但是我的女朋友很支持我做的事情,我想,我做完瞭,我的女朋友一定會看天氣的。於我,於我女朋友,我都必須以一個最好的態度與知識,去完成「小天氣」。

對此,我參考瞭眾多 Dribbble 大神的天氣作品,以及 App store 的天氣 app。最終,定下瞭初稿,有瞭大的思路。

台中商標權申請

(著名創意交流網站 Dribbble)

每種天氣狀況對應相應的顏色,易於用戶對界面有一個更加真實的直觀感受,並且每種天氣狀況也都應該有自己的動畫,這樣搭配在一起,像極瞭主題,直觀統一。



「小天氣」至此更新瞭好幾次,大多是因為 UI 優化,可能因為學的設計,在一些細節的處理上會犯強迫癥。

在這次開發過程中也遇到過難點,主要是一些數組的處理加工。

比如逐時天氣,需要在零點之後顯示新的一天的日期,要不 48 小時天氣很容易讓人有一種眼花繚亂的感覺。這就需要在原數組中,添加新的一天的日期,然後在 wxml 裡進行判斷調用。

後來也做瞭預警信息模塊,以及兩小時每五分鐘降雨量模塊。但是,這兩個模塊在平常天氣下不會顯示。隻在有當地氣象局發佈預警信息時,或兩小時內有降雨數據時才會分別顯示。這樣做的原因,是讓用戶在最短的時間閱讀完最重要、最需要的天氣信息。

「小天氣」在以後的更新中,UI 會繼續優化,並且會增加地理位置切換,查詢其它地區天氣的功能。另外,還會利用 canvas 生成今日天氣的圖片,排版會細致一些,利於大傢保存與分享。

當然啦,許許多多的小細節都需要完善,謝謝大傢的支持~

小天氣內有聯系方式,歡迎大傢一起交流。



「小天氣」小程序使用鏈接https://minapp.com/miniapp/3811/

關註「知曉程序」公眾號,在微信後臺回復「曉組織」,看厲害的人怎麼做小程序。

返回搜狐,查看更多

責任編輯:

聲明:本文由入駐搜狐號的作者撰寫,除搜狐官方賬號外,觀點僅代表作者本人,不代表搜狐立場。

閱讀 ()

台灣電動床工廠 電動床

台灣電動床工廠 電動床

AUGI SPORTS|重機車靴|重機車靴推薦|重機專用車靴|重機防摔鞋|重機防摔鞋推薦|重機防摔鞋

AUGI SPORTS|augisports|racing boots|urban boots|motorcycle boots

arrow
arrow

    ioo107c8c7 發表在 痞客邦 留言(0) 人氣()