基于微信的小程式 小胖工具箱01 - 計算器
已經上線了,可以去試一下,有bug什么的也可以直接提:)
微信小程式直接搜:一個學習用的小房間
目前計算器功能完整,接下來設計開發的是To Do List 待辦清單
我這邊主要涉及到到是構思和設計,開發實作這塊前后端以及優化微調都由@我教你跳傘咯來
產品考慮
整合日常常用工具類產品,輕量化,基礎功能,日常,設計年輕化,
計算器這塊的規劃沒有考慮科學計算器,還是滿足日常做一些簡單計算和換算使用,適用一些口算心算也可以完成的場景,追求一個效率化,使用微信時不用切換app來進行計算行為,
功能等同于一些第三方輸入法的自動運算功能,輸入框內輸入計算程序顯示答案,
具體要求:
1.可以使用0~9以及小數點進行常規的數學四則運算(加減乘除)
2.可以進行運算結果的正負切換
3.可以進行運算結果及計算程序中的百分比轉換
4.輸入錯誤時可以退格回洗掉
5.可以清除當前輸入和計算結果
6.正常顯示以上要求前提下追求較舒適的視覺感
工具
基于個人習慣的本次使用到的工具如下:
1.印象筆記
一款筆記類應用,我使用的是專業版,日常的作業筆記、腦圖、分析報表、markdown等都可以覆寫,
2.墨刀
一款輕量的原型設計應用,我使用的是付費版,針對移動端更友好一些,熟悉Axure的化會很容易上手,出圖更快,
3.Sketch
蘋果系統下的UIUE設計應用,我使用的版本是59,因為承擔了界面設計的職責,這是我目前用的最多的設計類應用,同樣,對移動端更友好,
4.藍湖
一款設計開發寫作類工具,個人團隊的話免費版足以,主要是高保真的切圖上傳自動標注,部分代碼參考等作用
原型

,
設計圖
有考慮根據系統是否在暗黑模式下的適應稿
所以包括了Normal和Dark兩套高保真

優化情況
優化的程序還是比較有意思的,簡單表述一下做個記錄
做這個工具箱的貧訓是和朋友摸索小程式朋友自己做了個計算器表示成就感爆棚,類似于“我摸透了我天下第一”
然后有了這個想法
規劃的時候發現可以做的太多了,計算器,匯率,日歷備忘,待辦事項,天氣,記賬感概現在便利的工具太多了
因為是自己的產品不涉及公司也不涉及商業運營就比較自由
簡單分類后考慮先做一些不涉及到后臺處理或者資料快取的,比如計算器,算完就完事兒了,對資料保留的需求不大,就會容易一些,
確定先做計算器就理邏輯,然后開整
我這邊主要還是一邊細化需求一邊找bug一邊改視覺
運算中是否考慮括號的功能
最初就是簡單的數字按鈕,考慮要不要提供小括號功能的時候遇到了一些分歧
這個功能和其他功能會有交叉,所以糾結了一下
如果提供括號:需要增加按鈕位置,用戶誤操作的可能性增加,自動補全右側括號的化退格也會有影響
如果不提供括號:無法更改既定的運算順序,永遠只保留先乘除后加減的順序,正負切換在沒有隱形括號的情況下對乘除也將不起效果
最后決定的還是不增加括號這個功能,簡化基本功能,如有需要,以后再考慮,
按鈕的點擊效果是否必要,怎么實作
從視覺角度來說我覺得計算器是一個按鈕點擊為主的工具
所有的輸入都是由單獨的按鈕點擊來觸發的
如果沒有按下/點擊效果就比較奇怪
那就考慮兩個形式
1.按鈕現在其實是底色+icon的形式,點擊時icon變化
2.點擊時icon不變化,給出底色(即點擊區)
實踐出真知,icon變化考慮了兩個方法,icon加陰影點擊時icon移動顯示陰影給一個假效果,因為我不是font awesome不能直接變化,第二個方法是考慮換Font Awesome
為了讓自己省力點,后者我直接斃了,然后效果看了一下,前者如果實作效果也不好,所以選擇了第二點,改變底色,
直接偷懶的做法就是用現成的,會產生一個丑陋的不是正方形的底色
需要換成比較漂亮的圓形,又產生了新的問題
是否重新切圖,是考慮代碼實作還是把透明icon按鈕切成帶有圓形的底色,考慮精靈圖這類方法,

大概是想達成這個效果,切圖大小主要影響的就是尺寸和顏色數,從我的角度出發肯定是希望能夠不改變切圖的情況下達成,那么就涉及到開發實作的問題,怎么在使用現有透明底切圖的情況下,加一層,點擊時也能進行顏色改變,(本問題已經解決)
也有一些一直在糾結的問題還需要解決
正負號和百分號作用只作用于結果還是算式也可以使用,以什么形式
是否需要增加按鈕提示音效
上部顯示區域是否過于緊湊
按鈕區域過大,單手操作比較費勁
轉載請註明出處,本文鏈接:https://www.uj5u.com/qita/172166.html
標籤:其他
上一篇:NB-IoT模組查詢UE狀態注意事項(NB-IoT網路信號測驗)
下一篇:超聲波中級實踐篇--三點定位
