MakerRepo Administrators, MakerRepo Staff
756
edits
Changes
Jump to navigation
Jump to search
mLine 57:
Line 57: − + Line 65:
Line 65: − + Line 78:
Line 78: + Line 92:
Line 93: − + − + − + − + − + − + − + − * Tools for building PWA's: + − + − + + + + + + + + + + + + +
Professional development/Design thinking/Software prototyping and tools (view source)
Revision as of 13:48, 10 February 2022
, 13:48, 10 February 2022no edit summary
|Functional software
|Functional software
|}
|}
Here are some metrics that might be useful for you https://www.nngroup.com/articles/usability-metrics/.
Here are some metrics that might be useful for you https://www.nngroup.com/articles/usability-metrics/ and some UI tips https://lawsofux.com/.
===Sharing===
===Sharing===
===Tools===
===Tools===
Here is a list of tools for <u>UI and UX prototyping</u> that could be useful and are very easy to use: https://blog.prototypr.io/top-20-prototyping-tools-for-ui-and-ux-designers-2017-46d59be0b3a9 (Figma, Balsamiq and Adobe XD are suggested which are free or free for students).
Here is a list of tools for <u>UI and UX prototyping</u> that could be useful and are very easy to use: https://blog.prototypr.io/top-20-prototyping-tools-for-ui-and-ux-designers-2017-46d59be0b3a9 (Figma, Balsamiq and Adobe XD are suggested which are free or free for students). [https://app.diagrams.net/ Draw.io] is also useful for <u>flowcharts</u>.
Ensure that when you design your UI for clients having <u>accessibility needs</u>, you take into considerations the colours you use.
Ensure that when you design your UI for clients having <u>accessibility needs</u>, you take into considerations the colours you use.
*[https://appinventor.mit.edu/ MIT app inventor] (android apps only)
*[https://appinventor.mit.edu/ MIT app inventor] (android apps only)
*[https://thunkable.com/#/ Thunkable] (android and iOS apps)
*[https://thunkable.com/#/ Thunkable] (android and iOS apps)
*[https://www.adalo.com/ Adalo] (android and iOS apps, more limited then thunkable)
*[https://www.wix.com/ Wix] (website)
*[https://www.wix.com/ Wix] (website)
*[https://powerapps.microsoft.com/en-us/ Microsoft Power Apps] (android, iOS and windows)
*[https://powerapps.microsoft.com/en-us/ Microsoft Power Apps] (android, iOS and windows)
===Apple development===
===Apple development===
It is more complicated to develop apps for iPhone or Mac then for Android or Windows. You can get an [https://developer.apple.com/programs/ Apple developer account] which allows you to publish to the Apple store or to Test Flight however it costs 99$ USD/year. Publishing to these platforms also entails rigorous testing and must abide by Apple's high standards which does not make it a very feasible choice for a semester-long project.
It is more complicated to develop apps for iPhone or Mac then for Android or Windows. You can get an [https://developer.apple.com/programs/ Apple developer account] which allows you to publish to the Apple store or to Test Flight however it costs 99$ USD/year. Publishing to these platforms also entails rigorous testing and must abide by Apple's high standards which does not usually make it a very feasible choice for a semester-long project.
It is recommended to make [https://en.wikipedia.org/wiki/Progressive_web_application progressive web apps](PWA) when developing for Apple devices. These websites are able to be 'installed' on phones as if they were apps and there is a lot of documentation on it. Here are a few resources to get you started:
It is recommended to make [https://en.wikipedia.org/wiki/Progressive_web_application progressive web apps](PWA) when developing for Apple devices. These websites are able to be 'installed' on phones as if they were apps and there is a lot of documentation on it. Here are a few resources to get you started:
* What are PWA's: https://www.youtube.com/watch?v=4XT23X0Fjfk
*What are PWA's: https://www.youtube.com/watch?v=4XT23X0Fjfk
* Tutorial with HTML and javascript:
*Codebase for building PWAs:
** https://medium.com/james-johnson/a-simple-progressive-web-app-tutorial-f9708e5f2605
**[https://angular.io/ Angular] PWA guide- https://angular.io/guide/service-worker-getting-started
** https://dzone.com/articles/how-to-build-a-progressive-web-app-pwa-with-javasc
**[https://reactjs.org/ React] PWA guide- https://create-react-app.dev/docs/making-a-progressive-web-app/
* Convert web application to PWA: https://www.creativebloq.com/how-to/build-a-progressive-web-app
**[https://nextjs.org/ Next] PWA guide- https://github.com/vercel/next.js/tree/canary/examples/progressive-web-app
* Convert wix site to PWA: https://wappaa.com/wappstore/wix-site-to-app/
**HTML and javascript PWA tutorials
***https://medium.com/james-johnson/a-simple-progressive-web-app-tutorial-f9708e5f2605
** https://techbeacon.com/app-dev-testing/5-best-tools-building-progressive-web-apps-fast
***https://dzone.com/articles/how-to-build-a-progressive-web-app-pwa-with-javasc
** https://developers.google.com/web/updates/2015/12/getting-started-pwa
***https://web.dev/progressive-web-apps/
*One option is AWS (Amazon web services) as the framework for hosting the PWA
**Create an [https://aws.amazon.com/s3/pricing/ S3 bucket] for each project -> free, almost, might cost a couple of cents a month
**[https://aws.amazon.com/route53/pricing/ Route 53] to create the subdomains -> free
**[https://docs.aws.amazon.com/Route53/latest/DeveloperGuide/domain-register.html#domain-register-procedure Domains] -> to buy the domain for the class, might be $15 a year (not necessary for GNG)
**[https://aws.amazon.com/certificate-manager/ Certificates] -> free to get the ssl certificate
**[https://github.com/pricing GIthub] for hosting code and publishing to S3-> Free
*Tools for building PWA's:
**Convert web application to PWA: https://www.creativebloq.com/how-to/build-a-progressive-web-app
**Convert wix site to PWA: https://wappaa.com/wappstore/wix-site-to-app/
**https://techbeacon.com/app-dev-testing/5-best-tools-building-progressive-web-apps-fast
**https://developers.google.com/web/updates/2015/12/getting-started-pwa
**https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps
*
*