-
Notifications
You must be signed in to change notification settings - Fork 8
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
9 changed files
with
224 additions
and
10 deletions.
There are no files selected for viewing
Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1 +1,43 @@ | ||
| about page! | ||
| <header> | ||
| <h1>About</h1> | ||
| </header> | ||
|
|
||
| <div id="about"> | ||
| <h2>About multikanban</h2> | ||
| <p>Multikanban is surprisingly the result of too much procrastination. Developing a productivity tool to come out of a spiral of proctrastination seemed the best idea to learn how to develop in several of the latest technologies used in web development.</p> | ||
|
|
||
| <h3>The geek part</h3> | ||
|
|
||
| <p>You have so much to do. There’s so much to learn and try out I constantly feel overwhelmed and end up doing nothing. Time goes by and we’ll be dead soon enough so the idea of becoming more organized is always in our minds. </p> | ||
|
|
||
| <p>A couple of years ago, a friend introduced the concept of kanban in a project we were working in and since then I started using it for personal organization. I wrote down any ideas I had and prioritized them, seeing them getting done was a great motivation and really made a difference. It also helped me keep more things in mind, the typical thing you always want to do and always forget about was now written there for you to read it every day. I then read more about the topic, even stumbled upon <a href="http://www.personalkanban.com" target="_blank">personal kanban</a>. Damn, of course someone had thought about it before! </p> | ||
|
|
||
| <p>I used LeanKit and other apps based upon the concept of kanban but they were all too advanced, with tones of features I don’t need, like team management. So at some point the idea to develop my own app with my own needs came through. Multikanban doesn’t include new nor better features, it is just a minimalist app to manage several kanban boards, where everything is just one click away. You can easily create tasks, drag them around and sort them by date to see what you should have already done and haven’t yet.</p> | ||
|
|
||
| <h3>The other geek part</h3> | ||
|
|
||
| <p>I had played with PHP, JS or CSS before, but developing a complete single page application with an API REST and a js framework in the frontend looked like an interesting challenge to me. The truth is that I learnt a lot.</p> | ||
|
|
||
| <p>I like the concept of recursivity, so I found it funny to try to use and hone a methodology that would help me implement the methodology itself, in the form of an SPA. The most important thing now is to see if I can keep finding it useful to develop other side projects and get things done!</p> | ||
|
|
||
| <p>Another very interesting part of the project was to document every step and publish it in the <a href="http://blog.joanboixados.com" target="_blank">blog</a>. Writing down and trying to explain what you’ve learnt to others, really helps you understand things better. You don’t understand things until you can properly explain them. It is very motivating to see that someone learnt something out of it and it is also a way to give back from everything you’ve learnt thanks to others.</p> | ||
|
|
||
| <p>Some of the used techs, apps and tools I had to learn and play with include: Balsamiq, Adobe InDesign, MAMP, REST API, Silex (PHP), Composer, Postman, SQL, DQL, MySQL, Sequel Pro, GIT, Github, StackOverflow, NPM, Bower, Grunt, Requirejs, Backbone, Marionette, Underscore, jQuery, Bootstrap, CSS, LESS, Sublime Text 3 and Multikanban! Wow, if you think about it, that’s a hell of a lot of stuff to get familiar with. I forgot to tell about the most important app though, grooveshark x)</p> | ||
|
|
||
| <p>Obviously, this app is just a starter, there’s so much that can be improved, but it really gives you an idea of why the new techs exist, their purpose, and how the webdev is getting more complex every day. Try to do this without a js framework! Or without LESS! Or without Grunt! What a pain in the ass it would’ve been! </p> | ||
|
|
||
| <p>A very good decision was to use github to share the code and learn from and with others, both repos used for this project can be found at:</p> | ||
|
|
||
| <p> | ||
| - API: <a href="https://github.com/mezod/multikanban-api" target="_blank">https://github.com/mezod/multikanban-api</a> | ||
| </p> | ||
| <p> | ||
| - APP: <a href="https://github.com/mezod/multikanban" target="_blank">https://github.com/mezod/multikanban</a> | ||
| </p> | ||
|
|
||
| <p>At this point, what’s next? Well, first thing that comes to mind is testing. But improving environment definition and deployment should also be in the roadmap. It is now a good moment to think about which techs really made the difference and which ones you’d rather find an alternative to. </p> | ||
|
|
||
| <p>Finally, I just wanted to thank everyone who has helped me accomplish what looked hard for me to do not that long ago. Especially Ryan Weaver for his great job with the <a href="https://knpuniversity.com/" target="_blank">knpuniversity tutorials</a> and the guys at the <a href="https://gitter.im/marionettejs/backbone.marionette" target="_blank"> Marionette gitter community</a>.</p> | ||
|
|
||
| <p>To Alex 'ashiso' :-)</p> | ||
| </div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1 +1,78 @@ | ||
| help page! | ||
| <header> | ||
| <h1>Help</h1> | ||
| </header> | ||
| <div id="help"> | ||
| <p>Really? Do you really need help? Are you trying to tell me that the UI of the app is not good enough? Haha, kidding. Let’s try to explain the basic controls and how would I use multikanban.</p> | ||
|
|
||
| <h2>Basic controls</h2> | ||
| <h3>Menu</h3> | ||
|
|
||
| <p>In the left menu, you can control everything about the kanban boards. To create them you just press the “+”, write the kanban title and press “+” or “enter”.</p> | ||
|
|
||
| <p>The active kanban is the one with the white background.</p> | ||
|
|
||
| <p>You can edit any kanban title or just delete it (careful! You will lose all the tasks of the kanban!) by hovering over the kanban in the menu and clicking on the pencil (to edit) or the “x” (to delete).</p> | ||
|
|
||
| <p>You can reprioritize kanbans by dragging them up and down.</p> | ||
|
|
||
| <h3>Kanban</h3> | ||
|
|
||
| <p>You can edit the kanban title by clicking on the pencil when hovering the title. | ||
| Each kanban has 6 columns. Columns can be sorted by Custom sort (the priorization set by the user) using the list icon, date of creation ascending and descending, and date of completion ascending and descending using the arrows icon. The two last columns don’t have custom sort and are displayed by date of completion descending by default. The current sort type is shown by displaying the icons in green.</p> | ||
|
|
||
| <p>Each column header shows the number of tasks the column contains.</p> | ||
|
|
||
| <p>To add tasks, you have to click on the “+” in the Backlog column, define a title and click “+” or press “enter”.</p> | ||
|
|
||
| <p>Each task has a date of creation, a date of completion (when it applies) and a text that defines the task itself. You can edit the task by clicking on the pencil when hovering the task, or delete it by clicking the “X”. Deleting always requires confirmation.</p> | ||
|
|
||
| <p>Tasks can be dragged around the columns and into a different position in the same column. Note that if the task is dragged to a column with an specific sort order, the task will immediately be shown in the right position which might fall out of your viewport.</p> | ||
|
|
||
|
|
||
| <h2>How to use multikanban</h2> | ||
|
|
||
| <p>So let’s just understand kanban as a to do list. A collection of tasks. At first, you’ll just have a kanban full of tasks like “learn photography”, “do my personal blog” or “clean my room”. At some point though, you will see that some tasks are huge, and when you finally grow the courage to tackle them, you’ll want to divide them into several other tasks. It’s the time for “learn photography” to become a new kanban.</p> | ||
|
|
||
| <p>You create a new kanban called “Photography”, and start creating all the tasks related to photography you can come up with, from simple ideas to obvious things. All these ideas and tasks are created in the “Backlog”, which is basically a pool of tasks, many of which you will do and many of which you will never do. “Read about what camera to buy”, “Ask Jake about what camera should I buy”, “Buy a camera”, “get a flickr account”, “read about landscape photography”, “timelapse of Barcelona”, “underwater photography”, and a long etcetera.</p> | ||
|
|
||
| <p>When the backlog already has some of the tasks I want to do and I feel I have divided them enough I then use it as follows:</p> | ||
| <p>- At the beginning of every week I move the tasks I feel I will be able to do to the “To Do” column. With time you will learn to estimate better the amount of work you can get done (considering we have a life :D) but the idea is to define the most prioritary tasks out of random ideas that make no sense yet. I normally prioritize the tasks in the “To Do” column too. The first task is the one is should get rid of first and so on.</p> | ||
| <p>- Every day, move to “Doing” what you feel you can accomplish during that day. If you feel very productive, you can also just grab tasks one by one, the idea is basically that it gets obvious what you are doing and what you are not doing. We suck at doing more than one thing at the same time, so let’s just do what we are good at, tasks one by one.</p> | ||
| <p>- When you are done, just move them to the “Done” column. By the end of the week you’ll see what you’ve accomplished, and trust me, feels good.</p> | ||
| <p>- The week is over and you feel good, well, time to move all the tasks from “Done” to “Archive” and depending on what is left in “To Do” (empty? Good job!) decide what to take from the Backlog to tackle next.</p> | ||
| <p>- In “Archive” you’ll always be able to track all the work you’ve done since the project started.</p> | ||
| <p>- You may have seen there is an “On Hold” column too. It is for those tasks that you are doing but you can’t proceed for whoever reason, you are waiting for someone else to send you some info, you need to go pick something on a specific date, etcetera… It’s to take noise out of what you are actually “Doing”.</p> | ||
|
|
||
| <p>In every column tasks can be sorted by date. This is pretty cool to learn which tasks have been wandering over for too long, its not always about what we feel like doing but also about what we must do.</p> | ||
|
|
||
| <h2>Principles</h2> | ||
|
|
||
| <p>Calling them principles sounds pedant but these are some small pieces of knowledge that can really get you through when you understand their true meaning.</p> | ||
|
|
||
| <p>- <b>Visualize the workflow:</b> | ||
| The main idea of kanban is that you visualize the tasks you have to do and at which stage they are. It is not just a boring list but some notes that you drag around. The simple action of moving them to the right is motivating enough to get you going. You can see everything you have done in the blink of an eye and just keep going.</p> | ||
|
|
||
| <p>- <b>Limit work in progress:</b> | ||
| This is another of the main concepts behind kanban. We are not good at doing many things at a time, so limiting the work we are doing at every moment is very important. Step by step, drop by drop.</p> | ||
|
|
||
| <p>- <b>Divide and conquer:</b> | ||
| I think this is the most important. The more you divide your tasks the easier you’ll get them done. You will also feel like you have done more, and besides feeling good, you will have actually done more. Big tasks aren’t that intimidating once they are broken down.</p> | ||
|
|
||
| <p>- <b>Prioritize:</b> | ||
| Really, you can’t do everything. At least I can’t, it is so easy to come up with ideas but heh, doing them is quite different. Prioritize the tasks you have to do is as important as knowing what you have to give up to. Learn to discard.</p> | ||
|
|
||
| <p>- <b>Do a little bit everyday:</b> | ||
| This sounds dumb but it is key. Even in those days where you don’t have time nor will, just do something, the simplest of the tasks, but do it to keep the flow, the momentum going. Motivation is temporary.</p> | ||
|
|
||
| <p>- <b>Think about what's next:</b> | ||
| Or rephrased, think about what you are doing tomorrow. Going to sleep every night thinking about what you will be doing the next day is great to start thinking and motivating yourself about it.</p> | ||
|
|
||
|
|
||
| <h2>Examples</h2> | ||
|
|
||
| <p>There are many ways to use multikanban. Here, I explain the initially created examples that show different uses:</p> | ||
| <p>- <b>To do list:</b> You can use kanban as a general to do list. The tasks don’t even need to have much to do with each other, it is just what you need to get done. Instead of marking them as done you just drag them to the done column, you can even use it as an agenda for events that are to happen long in the future.</p> | ||
| <p>- <b>A project:</b> Something like the explained above “learn photography” or “create personal blog” are projects that involve several tasks, creating a kanban for each project is a very good way to categorize the tasks and to see the project you are doing in each project. Even prioritizing kanbans in the menu is a good way to go.</p> | ||
| <p>- <b>Books:</b> So you read a lot. Well, you can simply add all the books you want to read and track them. Some books will be just friends recommendations (Backlog), others will be awaiting in your shelf (To Do), one or two will be half way through in the night table, and others will be blurring away in your head (Done/Archive).</p> | ||
|
|
||
| </div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters