teleren/devto huggingface dataset:
Oficina de Usabilidade
Published: 2022-02-23 22:53:07

Resumo sobre o curso:
Oficina de Usabilidade
O QUE É USABILIDADE?
É para definir a facilidade com que as pessoas podem empregar uma ferramenta ou objeto a fim de realizar uma tarefa específica e importante.
CONTEXTO DO USUÁRIO
São coisas diferentes que tem a mesma função e entregam o mesmo resultado, porém de maneiras diferentes. Compreender a pessoa, sua necessidade, os produtos. Cada pessoa tem seu tipo de produto e necessidade.
NEGÓCIO
Quando você vai comprar um produto, cada tipo de produto se destaca e tem uma competição entre eles, é importante trazer um diferencial para o produto.
Não pensar só na posição de valores e sim na posição que a concorrência está posicionando também. A forma que você chama o seu público é importante, o certo é público de interesse e não público alvo, pode sim chamar de público alvo, mas o certo é público de interesse.
TECNOLOGIA
Nível de familiaridade que você tem com a tecnologia: design de interação, tamanho da letra, vantagem de interação...Interfaces: VR, AR... Não é tão explorado como os sistemas meio antigo tipo desktop.
PROCESSO
Basicamente funciona da seguinte maneira: 
Pesquisa -> Conceito -> Protótipo -> Validação -> Desenvolvimento -> Mercado
10 HEURÍSTICAS DE USABILIDADE
Jakob Nielsen, 1994
Heurística = regra geral, não específica
- Princípios de Design de Interação
- Análise de 249 problemas
VISIBILIDADE DO STATUS DO SISTEMA 
-Manter o usuário informado sobre o que está acontecendo
-Retorno apropriado
-Dentro de um período razoável
Um exemplo é os avisos de atualização de software, já deixa o usuário informado sobre isso.
CORRELAÇÃO COM O MUNDO REAL
Primeira coisa a linguagem, convenções do mundo real, ordem lógica e natural
CONTROLE DO USUARIO E LIBERDADE 
Saída de emergência, menor esforço, suporte undo (desfazer) e redo (refazer)
Na interface você tem mais liberdade para interagir, seja com a voz ou com o toque, não vai ter muito esforço para fazer isso.
CONSISTENCIA E PADRÕES
-Termos, situações ou ações consistentes
-Convenções da plataforma
Alguns termos é quando você vai instalar e desinstalar um aplicativo, sempre aparece a confirmação, se você quer ou não instalar ou desinstalar um aplicativo realmente
PREVENÇÃO AO ERRO
-Elimine propensão ao erro
-Apresente uma confirmação para prevenir erros críticos
ESTÉTICA E DESIGN MINIMALISTA 
-Diálogos relevantes 
-Informação excessiva diminui sua visibilidade relativa
FACILITE RECONHECIMENTO, DIAGNÓSTICO E RECUPERAÇÃO DE ERROS
-Linguagem corrente
-Indicação clara do problema 
-Sugestão de solução
Facilitar o problema, ajudando com soluções, a pessoa que está com dificuldade procurar ajuda com assistentes, tipo e-mail.
AJUDA E DOCUMENTAÇÃO
-Visível 
-Facilmente acessada 
-Ferramenta
MÉTODOS
Inspecionais: análise de um especialista 
Interpretativos: análise de IHC
Estatísticos: análise quantitativa de IHC
PROTÓTIPO EM PAPEL 
-Baixa fidelidade 
-Alta fidelidade 
O protótipo no papel, é basicamente um projeto seu que você desenha como ele quer.
LIVRO RECOMENDADO 
Hooked (Nir Eyal)
Raissa e Mariane
Oficina de Usabilidade 
Published: 2022-02-23 22:49:23

[Resumo](https://senacspedu-my.sharepoint.com/:w:/g/personal/raissa_campos_senacsp_edu_br/EQi8m5uySrdHvLfSgKCrwVMB2j-WZncHw7sdc9N154gB2w?e=fm0F5V)
use placeholder website to generate images
Published: 2022-02-23 22:48:49

## 1-How to use placeholder website to generate photos with the desired size : 

- First, let's see why you must use this website : 
> placeholder website allows you to use pictures in various sizes,
>You may also choose the text, in order to save time in finding images without having to put an actual image

## 2-How to use the website : 

- All you have to do is write the code for the site, followed by some instructions, we will see them

> Image size : 

```
<img src="https://via.placeholder.com/150" alt="">

``` 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tq0gxcfcwbi399p0lmkh.png)

> Determine the height and width : 

```
<img src="https://via.placeholder.com/600x250" alt="">
``` 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/21oc3u5a45gjtpuoqnkh.png)

> Colors : 

```
<img src="https://via.placeholder.com/300x250/ffa500" alt="">
``` 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zggchj37yhrb2bhm4x1z.png)


> To change the text color : 


```
<img src="https://via.placeholder.com/300x250/ffa500/FFF" alt="">

``` 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/h7jesyya57388a8pfb6u.png)
> To write text : 

```
<img src="https://via.placeholder.com/300x250/ffa500/FFF?text=mostafa+amine" alt="">
``` 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/t2qhe5xm6r4gywphpic2.png)
RESUMO DA USABILIDADE
Published: 2022-02-23 22:48:44

NOME: Matheus Henryck, Erick V. Gusson, Ingrid Rapace Coltri, Geovana J. Santos

Contexto do usuário

O modelo mais usável pode mudar não onde uma pessoa veio e como contexto ela cresceu, assim como podemos achar algo estranho, eles podem achar estranho o nosso, por mais função que o mesmo tinha a mesma e entreguem o mesmo resultado, porém, o método é diferente e tem ligação com sua cultura.

Processo:

A pesquisa da criação normalmente segue a ordem de pesquisa, o conceito e o processo de validação, desenvolvimento, nem sempre consegue chegar até o mercado, muitas vezes nem sequer da.

Heurísticas de Usabilidade

Visibilidade do status do sistema

- Manter o usuário informado sobre o que está disponível

- Retorno apropriado

- Dentro de um período razoável

Correlação com o mundo real

- Linguagem do usuário: palavras frases e conceitos familiares

- Convenções do mundo real

- Ordem lógica e natural

Controle do usuário e liberdade

- “Saída de emergência”

- Menor esforço

- Suporte “undo” (desfazer) e “redo” (refazer)

Consistência e padrões

- Termos, condições ou ações consistentes

- Convenções da plataforma

Prevenção ao erro

- Elimine a propensão ao erro

- Apresente uma confirmação para prevenir erros críticos

Reconhecimento ao invés da memória

- Ajuda contextual

- Informações para orientar as ações

- “Diálogo com o usuário

Flexibilidade e eficiência de uso

- Fácil para usuários leigos

- Flexível para se tornar ágil para usuários avançados

Estética e design minimalista

- “diálogos” relevantes

- Informação excessiva sua visibilidade relativa

Facilite o reconhecimento, diagnóstico e recuperação de erros

- Linguagem atual

- Indicação clara do problema

- Sugestão da solução

Ajuda e documentação

- Visível

- Facilidade acessada

- Ferramenta de busca

Avaliação de UX

Métodos

- Inspecionais: análise de um especialista

- Interpretativos: análise qualitativa de IHC

- Estatísticas: análise de IHC

Paradigmas de avaliação

- Gerrilha

- Testes de usabilidade

- Pesquisa de campo

- Avaliação preditiva

Framework decidir
Determinar os objetivos
Explorar as questões
Escolha um método e abordagem de avaliação
Identifique questões práticas
Decida como lidar com questões éticas/legais
Avalie, analise, interprete e apresente dados
RESUMO DO CURSO DO SANSUNG OCEAN 
Published: 2022-02-23 22:47:28

USABILIDADE 

•	Contexto cultural exemplo do vaso sanitário no Japão. Vasos completamente diferente do nosso modelo. 
•	Negócio, conhecer a concorrência e o método de marketing, presença digital é muito importante para o sucesso da empresa. 
•	Tecnologia novas tecnologias apresentadas a humanidade como os óculos vr. 
•	Processo 
•	Pesquisa 
•	Conceito 
•	Protótipo 
•	Validação  
•	Desenvolvimento 
•	Mercado  
Heurísticas da usabilidade 
Identificar o problema porem trazer a solução e medir sua eficiência e resultado.  
Jakob Nielsen 1994 
•	Manter informado os usuários de acontecimentos. 
•	Retorno apropriado. 
•	Dentro de um período razoável. 
Correlação com o Mundo real. 
•	Linguagem de usuário: palavras e conceitos familiares. 
•	Convenções do mundo real. 
•	Ordem logística e natural. 
Controle do Usuário e liberdade 
•	“Saída de emergência” 
•	Menor esforço 
•	Suporte “undo” (desfazer) e “redo” (refazer) 
Consistências e Padrões 
•	Termos e ações consistentes. 
•	Convenções da plataforma.
Prevenção ao erro 
•	Eliminar propensão ao erro. 
•	Apresentar confirmação para prevenir erros críticos. 
Reconhecimento ao invés de memória 
•	Ajuda contextual. 
•	Informações para orientar ações. 
•	“Diálogo” com o usuário.  
Flexibilidade e eficiência de uso 
•	Fácil para os leigos not gamer true. 
•	Flexível e ágio para usuários pikas. 
Estética e design minimalista  
•	“Diálogos” relevantes. 
•	Informações excessiva diminui a visibilidade relativa. 
 
FACILITE RECONHECIMENTO, DIAGNOSTICO E RECUPERAÇAO DE ERROS
- Linguagem corrente
- Indicação clara do problema
- Sugestão de solução
AJUDA E DOCUMENTAÇÃO


- Visível
- Facilmente acessada
- Ferramenta de busca


MÉTODOS

•	Inspecionais: análise de um especialista
•	Interpretativos: análise qualitativa de IHC
•	Estatísticos: análise quantitativa de IHC

PARADIGUIMAS DE AVALIAÇÃO

Guerrilha
Teste de usabilidade
Pesquisa de campo
Avaliação  preditiva

PROTÓTIPO EM PAPEL

Baixa fidelidade
Alta fidelidade


PROTOTIPAGEM RAPIDA: SOFTWARE
EX: MARVEL

PROTOTIPAGEM PLATAFORMAS
EX: ADOBE XD

FRAMEWORK DECIDE

•	Determine os objetivos
•	Explore as questões
•	Escolha um método e abordagem de avaliação
•	Identifique questões práticas
•	Decida como lidar com questões éticas/legais
•	Avalie, análise, interprete e apresente os dados


	SOR, NOS TE AMAMOS (;
Oficina de usabilidade 
Published: 2022-02-23 22:46:38


Resumo sobre o curso:
Oficina de Usabilidade
O QUE É USABILIDADE?
É para definir a facilidade com que as pessoas podem empregar uma ferramenta ou objeto a fim de realizar uma tarefa específica e importante.
CONTEXTO DO USUÁRIO
São coisas diferentes que tem a mesma função e entregam o mesmo resultado, porém de maneiras diferentes. Compreender a pessoa, sua necessidade, os produtos. Cada pessoa tem seu tipo de produto e necessidade.
NEGÓCIO
Quando você vai comprar um produto, cada tipo de produto se destaca e tem uma competição entre eles, é importante trazer um diferencial para o produto.
Não pensar só na posição de valores e sim na posição que a concorrência está posicionando também. A forma que você chama o seu público é importante, o certo é público de interesse e não público alvo, pode sim chamar de público alvo, mas o certo é público de interesse.
TECNOLOGIA
Nível de familiaridade que você tem com a tecnologia: design de interação, tamanho da letra, vantagem de interação...Interfaces: VR, AR... Não é tão explorado como os sistemas meio antigo tipo desktop.
PROCESSO
Basicamente funciona da seguinte maneira: 
Pesquisa -> Conceito -> Protótipo -> Validação -> Desenvolvimento -> Mercado
10 HEURÍSTICAS DE USABILIDADE
Jakob Nielsen, 1994
Heurística = regra geral, não específica
- Princípios de Design de Interação
- Análise de 249 problemas

VISIBILIDADE DO STATUS DO SISTEMA 
-Manter o usuário informado sobre o que está acontecendo
-Retorno apropriado
-Dentro de um período razoável
Um exemplo é os avisos de atualização de software, já deixa o usuário informado sobre isso.
CORRELAÇÃO COM O MUNDO REAL
Primeira coisa a linguagem, convenções do mundo real, ordem lógica e natural
CONTROLE DO USUARIO E LIBERDADE 
Saída de emergência, menor esforço, suporte undo (desfazer) e redo (refazer)
Na interface você tem mais liberdade para interagir, seja com a voz ou com o toque, não vai ter muito esforço para fazer isso.
CONSISTENCIA E PADRÕES
-Termos, situações ou ações consistentes
-Convenções da plataforma
Alguns termos é quando você vai instalar e desinstalar um aplicativo, sempre aparece a confirmação, se você quer ou não instalar ou desinstalar um aplicativo realmente
PREVENÇÃO AO ERRO
-Elimine propensão ao erro
-Apresente uma confirmação para prevenir erros críticos
ESTÉTICA E DESIGN MINIMALISTA 
-Diálogos relevantes 
-Informação excessiva diminui sua visibilidade relativa
FACILITE RECONHECIMENTO, DIAGNÓSTICO E RECUPERAÇÃO DE ERROS
-Linguagem corrente
-Indicação clara do problema 
-Sugestão de solução
Facilitar o problema, ajudando com soluções, a pessoa que está com dificuldade procurar ajuda com assistentes, tipo e-mail.
AJUDA E DOCUMENTAÇÃO
-Visível 
-Facilmente acessada 
-Ferramenta
MÉTODOS
Inspecionais: análise de um especialista 
Interpretativos: análise de IHC
Estatísticos: análise quantitativa de IHC
PROTÓTIPO EM PAPEL 
-Baixa fidelidade 
-Alta fidelidade 
O protótipo no papel, é basicamente um projeto seu que você desenha como ele quer.
LIVRO RECOMENDADO 
Hooked (Nir Eyal)
Raissa e Mariane
RESUMO DA USABILIDADE
Published: 2022-02-23 22:45:37


NOME: Matheus Henryck, Erick V. Gusson, Ingrid Rapace Coltri, Geovana J. Santos

Contexto do usuário

O modelo mais usável pode mudar não onde uma pessoa veio e como contexto ela cresceu, assim como podemos achar algo estranho, eles podem achar estranho o nosso, por mais função que o mesmo tinha a mesma e entreguem o mesmo resultado, porém, o método é diferente e tem ligação com sua cultura.

Processo:

A pesquisa da criação normalmente segue a ordem de pesquisa, o conceito e o processo de validação, desenvolvimento, nem sempre consegue chegar até o mercado, muitas vezes nem sequer da.

Heurísticas de Usabilidade

Visibilidade do status do sistema

Manter o usuário informado sobre o que está disponível
Retorno apropriado
Dentro de um período razoável
Correlação com o mundo real

Linguagem do usuário: palavras frases e conceitos familiares
Convenções do mundo real
Ordem lógica e natural
Controle do usuário e liberdade

“Saída de emergência”
Menor esforço
Suporte “undo” (desfazer) e “redo” (refazer)
Consistência e padrões

Termos, condições ou ações consistentes
Convenções da plataforma
Prevenção ao erro

Elimine a propensão ao erro
Apresente uma confirmação para prevenir erros críticos
Reconhecimento ao invés da memória

Ajuda contextual
Informações para orientar as ações
“Diálogo com o usuário
Flexibilidade e eficiência de uso

Fácil para usuários leigos
Flexível para se tornar ágil para usuários avançados
Estética e design minimalista

“diálogos” relevantes
Informação excessiva sua visibilidade relativa
Facilite o reconhecimento, diagnóstico e recuperação de erros

Linguagem atual
Indicação clara do problema
Sugestão da solução
Ajuda e documentação

Visível
Facilidade acessada
Ferramenta de busca
Avaliação de UX

Métodos

Inspecionais: análise de um especialista
Interpretativos: análise qualitativa de IHC
Estatísticas: análise de IHC
Paradigmas de avaliação

Gerrilha
Testes de usabilidade
Pesquisa de campo
Avaliação preditiva
Framework decidir
Determinar os objetivos
Explorar as questões
Escolha um método e abordagem de avaliação
Identifique questões práticas
Decida como lidar com questões éticas/legais
Avalie, analise, interprete e apresente dados
Azure Phone Chatbot
Tags: azuretrialhack
Published: 2022-02-23 22:29:11




### Overview of My Submission

This is Azure Friendly ChatBot using Azure Bot Service 💬 🤖

## Step by step:
1.create Azure free account
2.create QnA maker in Azure

![image](https://user-images.githubusercontent.com/77109037/155405114-2797c5c6-2728-4566-9d89-3af9fcc8b096.png)


![image](https://user-images.githubusercontent.com/77109037/155404948-8cdd1d7c-fdd1-4ed3-827d-15e1bf8818b5.png)

 3.Navigate to QnA Maker Portal

![image](https://user-images.githubusercontent.com/77109037/155405306-35f4da6e-c454-45bb-a7e2-50a9d123a5a4.png)

4.Create a Knowledge Base

![image](https://user-images.githubusercontent.com/77109037/155405558-038ea3ad-7251-4784-add8-bd801e64d36f.png)

5.Add a chit-chat Knowledge Base by selecting a personality or add your own QnA

![image](https://user-images.githubusercontent.com/77109037/155406015-91126886-f7a7-4256-86f3-42086ec398dd.png)

6.Create Bot and navigate to Channels tab

![image](https://user-images.githubusercontent.com/77109037/155406307-4896f7b3-132c-4a6e-9659-97db7a700f4e.png)

7.Get the embedded codes, replace YOUR_SECRET_HERE with your secret key and embed code into your website

![image](https://user-images.githubusercontent.com/77109037/155406665-db42e105-aa49-4254-92c5-8c4084cf830c.png)

![image](https://user-images.githubusercontent.com/77109037/155406716-38eed4f4-6b55-40f4-ab3e-49b0350ca624.png)

8.Make 3d phone design 


<img width="100%" style="width:100%" src="https://media.giphy.com/media/Lp9c8dbRRbJcxt3Twm/giphy.gif">

## The Team 
- Verica Spaskovska https://dev.to/verica02
- Georgios Christodoulidis 



### Submission Category: 
 Wacky Wildcards


### Link to Code on GitHub

{% github verica02/azure-phone-chatbot %} 


### Additional Resources / Info

https://azurechatbot.netlify.app/
Why Imperfect Data Isn't Just Bad, It's Harmful w/ Treeverse's Einat Orr
Tags: podcast, database, datascience, techtalks
Published: 2022-02-23 22:23:23

***Dev Interrupted has a new podcast page on Dev.to! [Have a listen over here!](https://dev.to/dev-interrupted)***

Data junkies rejoice, this is the episode for you. 

On this week’s episode of [Dev Interrupted](https://devinterrupted.com/podcasts/), Einat Orr, co-founder and CEO of [Treeverse](https://treeverse.io/), sits down with us to talk about the state of data… where it’s been, where it’s going and why having bad data might be worse than having no data at all.

Einat's path to becoming a CEO is different from many of the folks who come on the podcast. After graduating with a PhD in mathematics, she spent much of her career as a CTO due to her extraordinary technical expertise. But things changed when Einat and her cofounder asked themselves a simple question: if code has Git, why doesn’t data have a “Git-equivalent”? 

Their exploration of this question inspired Treeverse. In a technical deepdive, Einat walks Dev Interrupted’s executive producer Conor Bronsdon through the founding story of Treeverse, why data needs its own version of Git, the specifics of data warehouses & data versioning, and what the future of data storage looks like. 

Put on your thinking caps and enjoy!

{% spotify spotify:episode:4FyYpTITjRkmc5mrmnOMoA %}

## Episode Highlights Include:
* (1:57) Why Einat fought to be CTO, but ended up a CEO
* (8:41) Everyone has huge amounts of data, not just internet companies
* (12:31) The inspiration behind creating [“Git” for data](https://lakefs.io/)
* (22:37) Data versioning, 3 major categories
* (29:29) How a PhD in math changed Einat’s management style 
* (37:53) What Einat learned as a speaker at INTERACT 1.0

## [You're Invited to INTERACT on April 7th](https://devinterrupted.com/event/interact/)

Join engineering leaders from Netflix, Slack, Stack Overflow, American Express & more at LinearB's virtual engineering leadership conference, [**INTERACT**](https://devinterrupted.com/event/interact/) on **April 7th, 2022.**

**1 day, 20 speakers, 1,000s of engineering leaders - all driven by the Dev Interrupted community.** If you are a team lead, engineering manager, VP or CTO looking to improve your team, this is the conference for you!

[**Learn more here**](https://devinterrupted.com/event/interact/)


![Join INTERACT at https://devinterrupted.com/event/interact/](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2xhtonct1vkpjhrtzfl3.png)
A Vue3 Tutorial - 08 Vue Components without a Build System 2 (A Better Way)
Tags: vue, javascript, beginners, tutorial
Published: 2022-02-23 22:11:04

Once again bit by the bug of not reading the manual enough! I ended up spending time at the car dealership with time to kill and read the vue guide. Eventually I got to the part about components and found that you could already load vue components in the browser without a build system!

After giving it look, it seemed like exactly what I want with 1 major drawback from what I can tell. instead of writing .vue file you'd need to write a js file. Besides that, it seems pretty much the same. The big gain here would be the fact that you don't need to ship vue3-sfc-loader and it would cut out some of the code in the main file.

First, we can convert our table.vue file to table.js. Next we move the styles in table.js to the index file. I haven't figured out how to do styles scoped to a component yet.

Now the next step is to put the template tag inside a javascript variable. We can easily do this by using template literal strings.

```
const template = `
    <div v-if="workers.length === 0">No workers available.</div>

    <div v-else>
        ...
    </div>
`;

export default {
    props: ["headers", "workers",],
    data() {
        return {
            sortColumn: "",
            order: "ASC",
            searchString: "",
        }
    },
    template: template,
    ...
}
```

We also set the template property on our Vue config object that we export out.

With that, we are done setting up our component for use in the browser. The changes are pretty superficial, so changing this to be a .vue file would be very easy.

The next thing to do is we'll load our component in our index file.

```
<script>
    Vue.createApp({
        data() {
            return {
                headers: [],
                workers: [],
            }
        },
        components: {
            'Table': Vue.defineAsyncComponent( () => import('./table.js'))
        },
        template: `<Table :headers="headers" :workers="workers"></Table>`,
        methods: {
            ...
        },
        mounted() {
            this.getWorkers();
        }
    }).mount('#app')
</script>
```

Here we can remove all the code relevant to vue3-sfc-loader and just set up the components variable to reference our table.js file.

With that we have the ability to use components in the web!

This is much simpler! Vue has a great guide, not quite at the level of some of the best documentation but its pretty thorough and explains things well. I should have read it earlier as I did learn quite a bit.
Git rebase to the beginning of time
Tags: git, cli, todayilearned
Published: 2022-02-23 21:57:44

---
canonical_url: https://waylonwalker.com/til/git-rebase-root/
published: true
tags:
- git
- cli
- til
series: til
title: Git rebase to the beginning of time
---

Git has a built in way to rebase all the way back to the beginning of time.  There is no need to scroll through the log to find the first hash, or find the total number of commits. Just use `--root`

```
git rebase --root
```
HTML101: A Beginners Guide To Code
Published: 2022-02-23 21:23:59

HTML101: A Beginners Guide To [Code](https://teamboma.com/coding-skills/html101-a-beginners-guide-to-code)

 https://teamboma.com/coding-skills/html101-a-beginners-guide-to-code

[TEAM BOMA](https://teamboma.com)
Looking for your own crypto?
Tags: token, blockchain, crypto, ether
Published: 2022-02-23 21:10:51

Many people wonder how cryptocurrencies are created. Apparently there are over 10k of them and their number is constantly growing. People get rich on cryptocurrencies in a very short time. What if you made your own cryptocurrency? Nothing easier! With our Multichain Token Generator https://www.token4u.io you will create your token in a few minutes. In our application you can choose from several cryptocurrency wallets and as many as 16 blockchains!