{"id":9,"date":"2022-11-08T01:27:13","date_gmt":"2022-11-08T01:27:13","guid":{"rendered":"https:\/\/blogs.oregonstate.edu\/osuengineertechblog\/?p=9"},"modified":"2022-11-08T01:27:13","modified_gmt":"2022-11-08T01:27:13","slug":"technologies-i-am-using-for-this-project","status":"publish","type":"post","link":"https:\/\/blogs.oregonstate.edu\/osuengineertechblog\/2022\/11\/08\/technologies-i-am-using-for-this-project\/","title":{"rendered":"Technologies I am using for this Project"},"content":{"rendered":"\n<p>Topic: Technologies I am using: <strong>draw.io <\/strong>and <strong>Figma<\/strong><\/p>\n\n\n\n<p>The most needed tool was a program that could freely design diagrams. I have many ideas, but the web applications I know, such as Trello, photoshop, or slack, do not support the features I want.<\/p>\n\n\n\n<p>Things I want to have from the flow chart design website:<br>* Supports various shapes<br>* Various colors<br>* Various font changes and size changes<br>* There are convenient exporting functions.<br>* Easy integration with Google service<br><\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"448\" src=\"https:\/\/osu-wams-blogs-uploads.s3.amazonaws.com\/blogs.dir\/6206\/files\/2022\/11\/Capture2-1024x448.png\" alt=\"\" class=\"wp-image-11\" srcset=\"https:\/\/osu-wams-blogs-uploads.s3.amazonaws.com\/blogs.dir\/6206\/files\/2022\/11\/Capture2-1024x448.png 1024w, https:\/\/osu-wams-blogs-uploads.s3.amazonaws.com\/blogs.dir\/6206\/files\/2022\/11\/Capture2-300x131.png 300w, https:\/\/osu-wams-blogs-uploads.s3.amazonaws.com\/blogs.dir\/6206\/files\/2022\/11\/Capture2-768x336.png 768w, https:\/\/osu-wams-blogs-uploads.s3.amazonaws.com\/blogs.dir\/6206\/files\/2022\/11\/Capture2-1536x672.png 1536w, https:\/\/osu-wams-blogs-uploads.s3.amazonaws.com\/blogs.dir\/6206\/files\/2022\/11\/Capture2-2048x895.png 2048w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>The <strong><a href=\"http:\/\/draw.io\">draw.io<\/a><\/strong> website is the best website that contains all the features I want. My favorite feature is that it can be linked with google drive, so it can be easily shared with team members, and the team members don&#8217;t have to sign up for another website. When you first enter the website, you can select templates provided by the platform as default.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"794\" src=\"https:\/\/osu-wams-blogs-uploads.s3.amazonaws.com\/blogs.dir\/6206\/files\/2022\/11\/Capture1-1024x794.png\" alt=\"\" class=\"wp-image-12\" srcset=\"https:\/\/osu-wams-blogs-uploads.s3.amazonaws.com\/blogs.dir\/6206\/files\/2022\/11\/Capture1-1024x794.png 1024w, https:\/\/osu-wams-blogs-uploads.s3.amazonaws.com\/blogs.dir\/6206\/files\/2022\/11\/Capture1-300x233.png 300w, https:\/\/osu-wams-blogs-uploads.s3.amazonaws.com\/blogs.dir\/6206\/files\/2022\/11\/Capture1-768x595.png 768w, https:\/\/osu-wams-blogs-uploads.s3.amazonaws.com\/blogs.dir\/6206\/files\/2022\/11\/Capture1.png 1428w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>And similarly to other flow chart design websites, you can drag the desired shape block to the main page and change the color and text freely. The picture below is a web front-end diagram I made using the draw.io service.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"571\" height=\"551\" src=\"https:\/\/osu-wams-blogs-uploads.s3.amazonaws.com\/blogs.dir\/6206\/files\/2022\/11\/Untitled-Diagram.drawio-1.png\" alt=\"\" class=\"wp-image-13\" srcset=\"https:\/\/osu-wams-blogs-uploads.s3.amazonaws.com\/blogs.dir\/6206\/files\/2022\/11\/Untitled-Diagram.drawio-1.png 571w, https:\/\/osu-wams-blogs-uploads.s3.amazonaws.com\/blogs.dir\/6206\/files\/2022\/11\/Untitled-Diagram.drawio-1-300x289.png 300w\" sizes=\"auto, (max-width: 571px) 100vw, 571px\" \/><\/figure>\n\n\n\n<p>The biggest advantage of this program is that it can be linked with google drive as I mentioned. There are good programs like lucid chart, but sign-up is required to use the service, and other people do not have easy access to it. So draw.io, which can be saved in google drive and can be easily shared with team members, is the best website for me.<br><br><\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"433\" src=\"https:\/\/osu-wams-blogs-uploads.s3.amazonaws.com\/blogs.dir\/6206\/files\/2022\/11\/Capturef1-1024x433.png\" alt=\"\" class=\"wp-image-14\" srcset=\"https:\/\/osu-wams-blogs-uploads.s3.amazonaws.com\/blogs.dir\/6206\/files\/2022\/11\/Capturef1-1024x433.png 1024w, https:\/\/osu-wams-blogs-uploads.s3.amazonaws.com\/blogs.dir\/6206\/files\/2022\/11\/Capturef1-300x127.png 300w, https:\/\/osu-wams-blogs-uploads.s3.amazonaws.com\/blogs.dir\/6206\/files\/2022\/11\/Capturef1-768x325.png 768w, https:\/\/osu-wams-blogs-uploads.s3.amazonaws.com\/blogs.dir\/6206\/files\/2022\/11\/Capturef1-1536x650.png 1536w, https:\/\/osu-wams-blogs-uploads.s3.amazonaws.com\/blogs.dir\/6206\/files\/2022\/11\/Capturef1-2048x866.png 2048w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>Second, the website I would like to recommend is a service called <a href=\"http:\/\/figma.com\" data-type=\"URL\" data-id=\"figma.com\"><strong>Figma<\/strong><\/a>. figma is the most convenient program to help you design the interface easily. It has a UI and work environment similar to Photoshop, so you can start quickly. The biggest advantage of this website is that you can easily create a mock website without coding.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"937\" src=\"https:\/\/osu-wams-blogs-uploads.s3.amazonaws.com\/blogs.dir\/6206\/files\/2022\/11\/Capturef2-1024x937.png\" alt=\"\" class=\"wp-image-15\" srcset=\"https:\/\/osu-wams-blogs-uploads.s3.amazonaws.com\/blogs.dir\/6206\/files\/2022\/11\/Capturef2-1024x937.png 1024w, https:\/\/osu-wams-blogs-uploads.s3.amazonaws.com\/blogs.dir\/6206\/files\/2022\/11\/Capturef2-300x274.png 300w, https:\/\/osu-wams-blogs-uploads.s3.amazonaws.com\/blogs.dir\/6206\/files\/2022\/11\/Capturef2-768x703.png 768w, https:\/\/osu-wams-blogs-uploads.s3.amazonaws.com\/blogs.dir\/6206\/files\/2022\/11\/Capturef2.png 1045w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p><\/p>\n\n\n\n<p>It is really the best program because it is possible to collaborate easily. The advantage of being able to use all systems for free is also good for team projects. There is a really good advantage that high-quality work can be implemented in a short time with simple photoshop work.<\/p>\n\n\n\n<p>The quality of all web service platforms continues to increase and become free. For example, I was really surprised when I used a program called zoom during the Covid-19 pandemic. The advantage of being able to start such a convenient program for free is good news for users, but I thought that it might put pressure on new web services to be developed in the future as well. So, I hope that the AIID AI program to be developed this time will also be used by many people with good UI and services like other platforms.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Topic: Technologies I am using: draw.io and Figma The most needed tool was a program that could freely design diagrams. I have many ideas, but the web applications I know, such as Trello, photoshop, or slack, do not support the features I want. Things I want to have from the flow chart design website:* Supports &hellip; <a href=\"https:\/\/blogs.oregonstate.edu\/osuengineertechblog\/2022\/11\/08\/technologies-i-am-using-for-this-project\/\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">Technologies I am using for this Project<\/span><\/a><\/p>\n","protected":false},"author":12966,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-9","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/blogs.oregonstate.edu\/osuengineertechblog\/wp-json\/wp\/v2\/posts\/9","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blogs.oregonstate.edu\/osuengineertechblog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blogs.oregonstate.edu\/osuengineertechblog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blogs.oregonstate.edu\/osuengineertechblog\/wp-json\/wp\/v2\/users\/12966"}],"replies":[{"embeddable":true,"href":"https:\/\/blogs.oregonstate.edu\/osuengineertechblog\/wp-json\/wp\/v2\/comments?post=9"}],"version-history":[{"count":1,"href":"https:\/\/blogs.oregonstate.edu\/osuengineertechblog\/wp-json\/wp\/v2\/posts\/9\/revisions"}],"predecessor-version":[{"id":16,"href":"https:\/\/blogs.oregonstate.edu\/osuengineertechblog\/wp-json\/wp\/v2\/posts\/9\/revisions\/16"}],"wp:attachment":[{"href":"https:\/\/blogs.oregonstate.edu\/osuengineertechblog\/wp-json\/wp\/v2\/media?parent=9"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blogs.oregonstate.edu\/osuengineertechblog\/wp-json\/wp\/v2\/categories?post=9"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blogs.oregonstate.edu\/osuengineertechblog\/wp-json\/wp\/v2\/tags?post=9"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}