Week 19 - Session 2 - Project Planning Tools

blog image source
Trello; a web-based Kanban project management application. A Trello board has four key components:
  • Boards - a board represents a project or a place to keep track of information. Whether you are launching a new website or planning a vacation, a Trello board is the place to organize your tasks and collaborate with your colleagues, family, or friends.
  • Lists - lists keep cards organized in their various stages of progress. They can be used to create a workflow where cards are moved across lists from start to finish, or simply act as a place to keep track of ideas and information.
  • Cards - the fundamental unit of a board is a card. Cards are used to represent tasks and ideas. A card can be something that needs to get done, like a blog post to be written or something that needs to be remembered, like company vacation policies.
  • Menu - the menu is where you manage members, control settings, filter cards, and enable Power-Ups. You can also see all of the activity that has taken place on a board in the menu’s activity feed.
Draw.io; an open source online diagram editor which is built around Google Drive, that enables you to create flowcharts, UML, entity relation, network diagrams, mockups and more. The platform can directly be integrated with google drive, dropbox, one drive, and GitHub.

You immediately can start creating a diagram for your specific project. Saving and loading diagrams created by Draw.io act as they would if you were using the program installed on your computer. These files are saved as .xml and can be used by various programs that can read such languages. The Diagrams can also be exported as .jpg, .png, .gif, .pdf, and .svg in order to be used on the Internet or otherwise distributed within an email.

One of Draw.io's more appealing features is the sheer amount of basic vector graphics that are available to the user. Although these graphics don't have heavy detail in them, they are still effective in order to produce the intended result without having to spend money on an application.

Connect to Google Drive in order to save your diagram in the cloud. Now, you can access your diagram from anywhere you have access to the Internet. Images can be imported to your diagram by using Google to search for the specifics.

Moqups; create blueprints of what your product should look like, a streamlined web app that helps you create and collaborate on wireframes, mockups, diagrams, and prototypes.
  • Design - envision, test and validate your ideas with quick wireframes and detailed mockups. Explore and iterate as your team builds momentum - moving seamlessly from lo-fi to hi-fi as your project evolves.
  • Plan - capture concepts and give direction to your projects with our professional diagramming tools. Create site-maps, flowcharts, storyboards - and jump effortlessly between diagrams and designs to keep your work in sync.
  • Prototype - create a functional prototype by adding interactivity to your designs. Simulate the user experience, uncover hidden requirements, find dead ends, and get final sign-off from all stakeholders before investing in development.
  • Collaborate - keep everybody on the same page, providing feedback at every stage of the design process. Hear all voices, consider all options - and establish consensus - by editing in real-time and commenting directly on the designs.
Trello - https://trello.com/
draw.io - https://www.draw.io/
Moqups - https://moqups.com/

Popular posts from this blog

Week 9 to 12 - Learning with MCR Codes

Image
My experience with  @MCRcodes   as a Quality Assurance Tester.  This is an evening part-time coding boot camp based in central Manchester which runs for 24 weeks, from February 2018 to July 2018. Week 9 (April 2018) - After spending two decades using the internet, I finally have an understanding how it works now, and the communication between the server and the client. Nice to create and run a simple server using Express and I now know what API actually means now, I think. Really appreciate how amazing and powerful the npm  package manager really  is, and looking forward to installing other future packages.  We have now started our back-end programming journey. Session 1 -  The Internet, the Web, HTTP Session 2 -  Web APIs & Express Week 10 - Really enjoying creating and reading test units for server assignments. Additionally, learning s ynchronous/a synchronous programming has been a tease.   Unfortunately, I was unable to attempt few classes due to unplanned c
Read more

Week 9 - Session 1 - The Internet, the Web, HTTP

Image
blog image source The internet, a worldwide network of computer networks, a llows transfer of information between networks, and the information is transferred using the internet protocol suite (IP/TCP). One of the most commonly used services on the internet is the world wide web (www). A primary mode of transferring data (resources) over the internet for billions. The application protocol that makes the web work is hypertext transfer protocol. blog image source As web developers, we are mainly interested in HTTP,  a protocol that web browsers and web servers use to communicate with each other over the Internet.  The Hypertext Transfer Protocol (HTTP) is designed to enable communications between clients and servers. HTTP works as a request-response protocol between a client and server. A web browser may be the client, and an application on a computer that hosts a website may be the server. How does the Internet work? -  https://developer.mozilla.org/en-US/docs/Learn/Common_
Read more

Week 8 - Session 1 - JavaScript in the Browser

Image
blog image source HTML document as a nested set of boxes. Tags such as <body> and </body> enclose other tags, which in turn contain other tags or text. There is an object, which we can interact with to find out things such as what HTML tag it represents and which boxes and text it contains. This representation is called the Document Object Model, or DOM for short. The global binding document gives us access to these objects. Its documentElement property refers to the object representing the <html> tag. Since every HTML document has a head and a body, it also has head and body properties, pointing at those elements. When a web page is loaded, the browser creates a Document Object Model of the page, which is an object oriented representation of an HTML document, that acts as an interface between JavaScript and the document itself and allows the creation of dynamic web pages: JavaScript can add, change, and remove all of the HTML elements and attributes in the page
Read more