diff --git a/content/Fundamenty/Proces.md b/content/Fundamenty/Proces.md index 4a0d417ec..bf3c02071 100644 --- a/content/Fundamenty/Proces.md +++ b/content/Fundamenty/Proces.md @@ -129,7 +129,7 @@ Zobacz wi臋cej 馃憠 [[Fundamenty/System zdobywania wiedzy]]. Koncepcja d藕wigni ([[Wiedza/Modele Mentalne/Leverage]]) jest jedn膮 z najwa偶niejszych jakie znam. Dzi臋ki niej raz wykonana praca daje mi efekty przez lata. -- M贸j czas nie jest na sprzeda偶 ([[Wiedza/Ksi膮偶ki/Principles]]) - od Q2 2020 podj膮艂em decyzj臋 o tym, 偶e nie b臋d臋 sprzedawa艂 swojego czasu. +- M贸j czas nie jest na sprzeda偶 ([[Wiedza/Ksi膮偶ki/Principles]]) - od Q2 2020 podj膮艂em decyzj臋 o tym, 偶e nie b臋d臋 sprzedawa艂 swojego czasu. Przyk艂adowo niemal ca艂kowicie ograniczy艂em konsultacje i zlecenia dla klient贸w na rzecz rozwijania w艂asnych produkt贸w. Robi臋 to wy艂膮cznie w sytuacjach w kt贸rych albo sprawia mi to frajd臋 albo daje korzy艣ci poza finansowe. - Podejmuj臋 dzia艂ania wykorzystuj膮ce skal臋 oraz pomagaj膮ce innym przez d艂ugi czas. - Podejmuj膮c dzia艂ania zadaj臋 sobie pytanie "jak z mojej jednej godziny zrobi膰 100?" [[Wiedza/Modele Mentalne/Leverage]] - [[Optymalizacja/Optymalizacja]] - zwracam uwag臋 na drobne szczeg贸艂y. Eliminuj臋 je lub optymalizuj臋 (np. przez upraszczanie) do granic mo偶liwo艣ci (albo rozs膮dku). diff --git a/content/Projekty/Design Maestro.md b/content/Projekty/Design Maestro.md index 2c76997ab..d675c3f71 100644 --- a/content/Projekty/Design Maestro.md +++ b/content/Projekty/Design Maestro.md @@ -33,3 +33,189 @@ Design Maestro oferuje mi臋dzy innymi: ![](https://space.overment.com/Screen-Shot-2022-05-16-17-48-51-GZEQZ/Screen-Shot-2022-05-16-17-48-51.png) + +README.md: +# Introduction +DesignMaestro is a set of macros of Keyboard Maestro which was build on top of [Custom HTML Prompt Action](https://wiki.keyboardmaestro.com/action/Custom_HTML_Prompt?s[]=prompt&s[]=html#Form_Validation). It was designed so creating a new macros are as easy as it possible by by using JSON objects. + +An example prompt looks like this: + +![](https://space.overment.com/Shared-Image-2022-05-17-13-37-01-TGsTn/Shared-Image-2022-05-17-13-37-01.png) + +A core of this project is an [Svelte](https://svelte.dev/) application bundled with [Vite.js](https://vitejs.dev/) to a single HTML file which may be loaded from `/dist` directory or by pasting it inline to `Custom HTML Prompt Action`. + +## Installation +1. Download this repostiory to your Mac +2. Go to a directory and run `npm install` +3. Build project with `npm run build` +4. Point `index.html` from `dist` directory to `Custom HTML Prompt Action` +5. After each change make sure you rebuild a project with `npm run build` + +## Predefined Macros +We have created a set of predefined, plug&play macros you can use right away. DesignMaestro macros were created with designers in mind to improving their work by saving time on repeatitive tasks. + +**This includes:** +- optimizing image file sizes +- removing backround from selected images +- saved assets picker +- saved color picker +- copy text from selected screen area (with OCR feature) +- global system picker (copying hex color from pixel which is pointed with a mouse) +- quick translation & searching +- quick creating a figma, notion and webflow projects +- pasting `Lorem ipsum dolor sit amet, consectetur adipiscing elit interdum hendrerit ex vitae sodales.` + +Those macros are available here for free: https://designmaestro.io. +(Premium set of packages is on a way) + +## Create a custom Prompt +DesignMaestro allows you to create a simple form which contains: +- a title & description +- form inputs (text, textarea, select, color, radio, datetime-local) +- actions buttons (confirm and cancel) + +An example looks like this: + +![](https://space.overment.com/Shared-Image-2022-05-17-14-17-46-tQzvt/Shared-Image-2022-05-17-14-17-46.png) + +In order to generate this prompt like this, basically you have to: +1. Create a JSON object and save it's stringify version in a `DMLauncher` variable of Keyboard Maestro. +2. Use `Execute a Macro` action and trigger `(util) Render` macro. + +All input values will be saved in Keyboard Maestro variables and names of those variables will match inputs `name` field. For example: `` value will be saved in a variable with a name `example`. + +| Please note that those variables will be saved only if Prompt will be ended with a confirmation (pressing `Enter` or `Primary button`) + +**JSON reference both for prompt and lists configuration looks like this:** +``` +{ + +聽 "type": "prompt", // prompt or list +聽 +聽 "actionType": "default", // required only for type: "list". default - trigger macro by name | download - downloads a image file and set its content to clipboard | copy - copy a value of list item to a clipboard + +聽 "header": { + +聽 聽 "active": true, + +聽 聽 "title": "", // prompt header + +聽 聽 "description": "" // prompt description + +聽 }, + +聽 "actions": { // custom prompt actions + +聽 聽 "mode": "decision", // decision | confirm. Decision displays boths confirmation & cancel buttons and confirm displays just a confirm button + +聽 聽 "visible": true, // true | false - with type of list, actions should be set to false + +聽 聽 "confirmLabel": "Translate", // confirm button label + +聽 聽 "cancelLabel": "Nevermind" // cancel button label + +聽 }, + +聽 "inputs": [] // see a reference below. This is required for `type: prompt` + + "list": [] // see a reference below. This is required for `type: list` + +} +``` + +**JSON reference for inputs looks like this:** + +As you can see it's an array of objects describing each input field. + +```json +[ + + { // TEXT / TEXTAREA / DATE INPUT FIELD + +聽 聽 聽 "type": "text", // text | textarea | datetime-local + +聽 聽 聽 "name": "textVar", // value of this input is connected with KM variable with this name + +聽 聽 聽 "label": "This is a text field", // input label +聽 聽 聽 +聽 聽 聽 "value": "default value", // it can be set right here or by setting a KM Variable with a name coresponding to this input name. +聽 聽 聽 +聽 聽 聽 "placeholder": "Type something", // input placeholder + +聽 聽 聽 "focused": true, // autofocus. Make sure to have a single one for each prompt + + "rows": 8 // for textarea only! Default: 8 + +聽 聽 }, + +聽 聽 { // COLOR picker input + +聽 聽 聽 "type": "color", + +聽 聽 聽 "name": "colorVar", // value of this input is connected with KM variable with this name. +聽 聽 聽 +聽 聽 聽 "value": "#ffffff", // it can be set right here or by setting a KM Variable with a name coresponding to this input name. + +聽 聽 聽 "label": "Quick Snippet", // input label + +聽 聽 }, +聽 聽 + { // SELECT input + +聽 聽 聽 "type": "select", + +聽 聽 聽 "name": "selectVar", // value of this input is connected with KM variable with this name. + +聽 聽 聽 "label": "Select something", // input label + +聽 聽 聽 "placeholder": "Choose", // input placeholder + +聽 聽 聽 "value": "en/pl", // default value + +聽 聽 聽 "focused": true, // autofocus. Make sure to have a single one for each prompt + + "options": [ // An array of options + { + "label":"Label", // Option label + "value": "option1", // Option value + "selected": true // true / false is selected + } + ] + } +] +``` + +**JSON reference for list items looks like this:** + +As you can see it's an array of objects describing each list item. + +``` +[ + { + "label": "", // list item main label + "value": "", // value of an item. May be: a macro name to trigger, value to be copied to clipboard or an image file needed to be downloaded and copied to clipboard + "description":"" // description of an item, is showing on a right side + "thumbnail": "" // (optional) url to a thumbnail (must be public and point to the image file) + } +] +``` + +## Confirm & Cancel actions +While prompt is displayed there're two ways to close it: by `confirming`, which means saving a variables to Keyboard Maestro or by `cancelling` and just closing a window. + +In order to make sure that following actions won't be activated, just use `if statement` and check if a variable called `DMContinue` is set to `true`, like so: + +![](https://space.overment.com/Shared-Image-2022-05-17-14-35-31-B6KCc/Shared-Image-2022-05-17-14-35-31.png) + +## Summary +In order to generate a new prompt you need to: +- create a configuration JSON +- add `inputs` (for type: prompt) and `list` (for type: list) +- trigger a macro called `(util) Render` with `Execute a Macro` action. + + +## Known issues +- Clicking on list item doesn't trigger an action +- Select input default value does not work +- There is no simple way to manage `DMSettings` (only for `Predefined Macros`) +